当前位置:首页 > JavaScript

js 实现 map

2026-03-13 19:16:15JavaScript

实现 Map 数据结构

在 JavaScript 中,可以通过对象或 ES6 的 Map 类来实现键值对存储。以下是几种实现方式:

使用 ES6 Map

ES6 引入了原生的 Map 类,支持任意类型的键值对存储:

js 实现 map

const map = new Map();
map.set('key1', 'value1');
map.set('key2', 'value2');

console.log(map.get('key1')); // 输出: value1
console.log(map.has('key2')); // 输出: true
map.delete('key2');
console.log(map.size); // 输出: 1

使用普通对象模拟 Map

如果环境不支持 ES6,可以用普通对象模拟 Map 的功能:

js 实现 map

const map = {};
map['key1'] = 'value1';
map['key2'] = 'value2';

console.log(map['key1']); // 输出: value1
console.log('key2' in map); // 输出: true
delete map['key2'];
console.log(Object.keys(map).length); // 输出: 1

自定义 Map 类

可以封装一个简单的 Map 类,实现基本功能:

class CustomMap {
  constructor() {
    this.items = {};
  }

  set(key, value) {
    this.items[key] = value;
  }

  get(key) {
    return this.items[key];
  }

  has(key) {
    return key in this.items;
  }

  delete(key) {
    if (this.has(key)) {
      delete this.items[key];
      return true;
    }
    return false;
  }

  size() {
    return Object.keys(this.items).length;
  }
}

const map = new CustomMap();
map.set('a', 1);
console.log(map.get('a')); // 输出: 1

使用 WeakMap

如果需要键是对象且避免内存泄漏,可以使用 WeakMap

const weakMap = new WeakMap();
const keyObj = {};
weakMap.set(keyObj, 'private data');
console.log(weakMap.get(keyObj)); // 输出: private data

注意事项

  • ES6 Map 的键可以是任意类型,普通对象的键只能是字符串或 Symbol。
  • Map 维护插入顺序,普通对象不保证顺序。
  • WeakMap 的键必须是对象,且不可枚举。

以上方法可根据实际需求选择使用。ES6 Map 是推荐方式,功能最完善。

标签: jsmap
分享给朋友:

相关文章

js实现文件下载

js实现文件下载

使用 a 标签下载文件 通过动态创建 a 标签并设置 download 属性实现文件下载。适用于已知文件 URL 或 Blob 数据的情况。 function downloadFile(url, f…

js实现vr

js实现vr

使用WebXR API实现VR体验 WebXR是浏览器中实现VR和AR体验的标准API,它取代了早期的WebVR。现代浏览器如Chrome、Edge和Firefox已支持WebXR。 // 初始化W…

js实现游标

js实现游标

使用JavaScript实现游标 在JavaScript中,可以通过操作DOM元素的cursor样式属性来实现自定义游标效果。以下是几种常见的实现方法: 修改默认鼠标指针样式 通过CSS的curso…

js实现求导

js实现求导

实现数值求导的方法 在JavaScript中实现求导通常采用数值方法,因为JavaScript不是符号计算语言。以下是常见的数值微分方法: 中心差分法 中心差分法提供较高精度的导数近似: func…

js实现授权

js实现授权

授权流程设计 授权流程通常涉及前端与后端的交互,常见方案包括OAuth2.0、JWT等。以JWT为例的典型流程: 用户提交凭证(如用户名密码)到认证服务 服务端验证通过后生成包含用户信息的JWT令牌…

js钟表实现

js钟表实现

实现JavaScript钟表的基本方法 创建一个简单的JavaScript钟表可以通过以下步骤完成,涵盖数字和模拟两种形式。 数字钟表实现 HTML结构只需一个显示时间的容器: <div i…