Map对象和普通对象的7个区别

简介: Map对象和普通对象的7个区别

1、初始化与使用

普通对象可以直接使用字面量进行初始化,而 Map 需要 Map() 构造函数进行初始化,如果想要有初始值,则需要传递一个数组或其他元素为键值对的可迭代对象。这些键值对中的每一个都将被添加到一个新的 Map 中。

    const obj = {
      name: 1,
      age: 18
    }
    // console.log('obj', obj); // obj {name: 1, age: 18}
    const map = new Map([
      ['name', 1],
      ['age', 11]
    ])
    map.set('address', 'ShenZhen'); //为 Map 对象中的键设置值。
    console.log(map.get('age')); // 获取 Map 对象中键的值。
    console.log(map.entries()); // 返回 Map 对象中键/值对的数组。
    console.log(map.keys()); // 返回 Map 对象中键的数组。
    console.log(map.values()); // 返回 Map 对象中值的数组。
    console.log('map', map); // map Map(3) {'name' => 1, 'age' => 11, 'address' => 'ShenZhen'}

与普通对象相比,Map 作为哈希表提供了许多有用的功能。比如判断一个 key 是否在 hash 表中,在 map 中可以使用 hash 方法轻松判断,但是在普通对象中可能会增加复杂度。


另外,set 方法可以为 Map 设置 key 值,get 方法可以获取 value ,size 属性可以返回当前 Map 中 key/value 对的数量,而 plain 对象需要手动计算 使用自己的方法等。。。

其他 Map() 方法

方法 描述
clear() 删除 Map 中的所有元素。
delete() 删除由键指定的元素。
has() 如果键存在,则返回 true。
forEach() 为每个键/值对调用回调。

2、密钥类型

普通对象只接受字符串和符号作为键值,其他类型将被强制转换为字符串类型,而 Map 可以接受任何类型的 键值(包括函数、对象或任何原语)

    const obj = {};
    const map = new Map();
    const key = function () { };
    obj[key] = 1;
    map.set(key, 1);
    console.log('obj', obj); // obj {function key() {}: 1} --> function key() {}: 1
    console.log('map', map); // map Map(1) {ƒ => 1} --> {function key() {} => 1}

3、Accidental Key

普通对象从原型继承了许多属性键,例如构造函数等。因此,自己的密钥很可能与原型上的密钥发生冲突。但 Map 默认不包含任何键,它只包含那些显式放入的。

    const obj = {};
    const map = new Map();
    console.log('obj', obj.constructor); // obj ƒ Object() { [native code] }
    console.log('map', map.get('constructor')); // map undefined

4、key order

虽然现在普通对象的键进行了排序,但情况并非总是如此,而且排序很复杂。例如,如果对象中有键需要转换为字符串,则不保留对象键的原始顺序,虽然 Map 以简单的方式排序,但他始终与我们插入的顺序相同

    const obj = {
      name: 1,
      age: 11,
      3: 111
    };
    const map = new Map([
      ['name', 1],
      ['age', 11],
      [3, 111]
    ]);
    console.log('obj', obj); // obj {3: 111, name: 1, age: 11}
    console.log('map', map); // Map(3) {'name' => 1, 'age' => 11, 3 => 111}

5、迭代

我们可以使用 for...of 语句或 Map.prototype.forEach 直接迭代 Map 的属性,而普通对象不能直接迭代。

    const obj = {
      name: 1,
      age: 11,
    };
    const map = new Map([
      ['name', 1],
      ['age', 11],
    ]);
    for (const [key, value] of map) {
      console.log(`${key}:`, value); // name:1,age:2
    }
    map.forEach((t, key) => {
      console.log(`${key}:`, t); // name:1,age:2
    })
    Object.keys(obj).forEach(t => {
      console.log(`${t}:`, obj[t]); // name:1,age:2
    })

6、序列化和解析

普通对象支持 JSON 序列化,但 Map 默认无法获取正确数据。

    const obj = {
      name: 1,
      age: 11,
    };
    const map = new Map([
      ['name', 1],
      ['age', 11],
    ]);
    console.log('obj', JSON.parse(JSON.stringify(obj))); // obj {name: 1, age: 11}
    console.log('map', JSON.parse(JSON.stringify(map))); // map {}

7、性能

Map 对象在涉及频繁删除和添加键值对的场景中表现更好,而普通对象没有优化。

总结

那么普通对象应该被 Map 对象替换吗?


不,如果我们想在 JSON 和原始数据之间转换或包含特定的业务逻辑,那么我们应该使用普通对象。因为当我们只想存储键值对和循环操作或不断添加和删除属性时,使用 Map 对象是更好的选择。


Map对象虽然也是继承自底层的Object.prototype,但它为我们提供了很多实用的方法来减轻我们的认知负担,比普通对象更高级。


相关文章
|
7月前
|
存储 JavaScript 索引
js开发:请解释什么是ES6的Map和Set,以及它们与普通对象和数组的区别。
ES6引入了Map和Set数据结构。Map的键可以是任意类型且有序,与对象的字符串或符号键不同;Set存储唯一值,无重复。两者皆可迭代,支持for...of循环。Map有get、set、has、delete等方法,Set有add、delete、has方法。示例展示了Map和Set的基本操作。
105 3
|
3月前
ES6中map对象的使用,确实比Object好使哈
ES6中Map对象的使用优势,包括任意类型作为键、直接获取大小、增删查改操作等。Map的键可以是函数、对象、NaN等,支持forEach循环和for...of循环。
35 1
ES6中map对象的使用,确实比Object好使哈
|
2月前
|
存储 JavaScript 前端开发
Set、Map、WeakSet 和 WeakMap 的区别
在 JavaScript 中,Set 和 Map 用于存储唯一值和键值对,支持多种操作方法,如添加、删除和检查元素。WeakSet 和 WeakMap 则存储弱引用的对象,有助于防止内存泄漏,适合特定场景使用。
|
2月前
|
存储 缓存 Java
【用Java学习数据结构系列】HashMap与TreeMap的区别,以及Map与Set的关系
【用Java学习数据结构系列】HashMap与TreeMap的区别,以及Map与Set的关系
43 1
WK
|
3月前
|
Python
map和filter的区别是什么
`map()`和`filter()`均为Python中的高阶函数,前者针对可迭代对象中的每个元素执行指定操作,如数值翻倍或字符串转大写;后者则筛选出符合条件的元素,例如仅保留偶数或非空字符串。两者均返回迭代器,并可通过`list()`等函数转换为所需的数据结构。具体使用时,应依据实际需求和场景选择合适的函数。
WK
29 1
WK
|
3月前
map和filter的区别是什么
在编程中,`map` 和 `filter` 是处理数组或集合时常用的两个函数。`map` 用于将每个元素通过指定函数转换后生成新的数组,而 `filter` 则根据条件筛选出符合条件的元素组成新数组。两者的主要区别在于:`map` 的返回数组长度与原数组相同,但元素被转换;`filter` 的返回数组长度可能不同,只包含符合条件的元素。
WK
43 2
|
3月前
数组方法中的`forEach()`方法和`map()`方法有什么区别?
数组方法中的`forEach()`方法和`map()`方法有什么区别?
|
4月前
|
Java
【Java集合类面试二十二】、Map和Set有什么区别?
该CSDN博客文章讨论了Map和Set的区别,但提供的内容摘要并未直接解释这两种集合类型的差异。通常,Map是一种键值对集合,提供通过键快速检索值的能力,而Set是一个不允许重复元素的集合。
|
4月前
|
分布式计算 Serverless 数据处理
|
4月前
|
存储 Java 索引