【面试题】JS中Map、WeakMap和Object的区别_面试题 map和weekmap(1)

本文链接：https://blog.csdn.net/2401_84435885/article/details/138602926

最后

推荐一些系统学习的途径和方法。

路线图

每个Web开发人员必备，很权威很齐全的Web开发文档。作为学习辞典使用，可以查询到每个概念、方法、属性的详细解释，注意使用英文关键字搜索。里面的一些 HTML，CSS，HTTP 技术教程也相当不错。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

HTML 和 CSS：

html5知识

css基础知识

方法和操作：

Object具有一些特定于对象的方法和操作，例如Object.keys()和Object.values()等。Map和WeakMap提供了一些特定于映射的方法和操作，例如Map.has()和WeakMap.delete()等。

继承：

Object具有原型继承，即属性可以从原型链中继承。而Map和WeakMap不具有原型继承，它们是独立的数据结构。

使用场景：

当需要使用非字符串键时，可以使用Map。
当需要存储与对象相关联的元数据时，可以使用WeakMap。
当需要存储对象属性时，可以使用Object。
当需要避免内存泄漏和手动释放内存时，可以使用WeakMap。
当需要遍历和操作属性时，可以使用Object。

下面是一些使用Map、WeakMap和Object的示例：

使用Map：

// 创建一个Map
const map = new Map();

// 添加键值对
map.set('name', 'John');
map.set(42, 'Age');
map.set({ key: 'objectKey' }, 'This is an object key');

// 获取值
console.log(map.get('name')); // 输出：John

// 遍历Map
map.forEach((value, key) => {
  console.log(`${key}: ${value}`);
});
// 输出：
// name: John
// 42: Age
// [object Object]: This is an object key

// 获取Map大小
console.log(map.size); // 输出：3

使用WeakMap：

// 创建一个WeakMap
const weakMap = new WeakMap();

// 创建对象作为键
const obj1 = { id: 1 };
const obj2 = { id: 2 };

// 添加键值对
weakMap.set(obj1, 'Object 1');
weakMap.set(obj2, 'Object 2');

// 获取值
console.log(weakMap.get(obj1)); // 输出：Object 1

// 无法遍历WeakMap或获取其大小

使用Object：

// 创建一个Object
const obj = {};

// 添加键值对
obj['name'] = 'John';
obj[42] = 'Age';
obj[{ key: 'objectKey' }] = 'This is an object key'; // 这里键会被转换为字符串

// 获取值
console.log(obj['name']); // 输出：John

// 遍历Object
for (const key in obj) {
  console.log(`${key}: ${obj[key]}`);
}
// 输出：
// name: John
// 42: Age
// [object Object]: This is an object key

// 获取Object大小（需要手动计算）
console.log(Object.keys(obj).length); // 输出：3