JavaScript中的Map vs Object

Map（映射） 是一种数据结构，用于以键值对的形式存储数据。该键值对由唯一键和与键相关联的值组成。它可以防止重复。

Object（对象） 遵循与Map相同的概念，即使用键值对存储数据。但是有一些细微的区别，使得在某些情况下Map的性能更好。

一些基本的区别如下：

1. 在对象中，键字段的数据类型限制为整数、字符串和符号。而在Map中，键字段可以是任何数据类型（整数、数组，甚至是对象！）
2. 在Map中，元素的原始顺序被保留。而在对象中这是不成立的。
3. Map是对象的一个实例，但反之则不成立。

示例：

<script> 
    var map = new Map([ 
        [5, 4], 
        [7, 9] 
    ]); 
  
    //output:true 
    console.log(map instanceof Object);  
  
    //output:false 
    var obj = new Object(); 
    console.log(obj instanceof Map);  
</script> 

输出：

true
false

让我们深入了解一些概念，这些概念使得 Object 与 Map 不同。

声明: 在JavaScript中，创建对象的方式有很多种。例如：

• 通过直接字面量：

var obj = {}; 
var obj = {1:"对象名称"， 2:"测试"}; 
console.log(obj); 

输出:

Object

• 使用构造函数：

var obj = new Object(); // 空对象
var obj = new Object;
console.log(obj);

输出:

Object

• 使用object.create：

function fruits() { 
    this.name = '水果1'; 
    this.season = '夏季'; 
} 

function apple() { 
    fruits.call(this); 
} 

apple.prototype = Object.create(fruits.prototype); 
const app = new apple();
console.log(app.name);
console.log(app.season);

fruit 1
summer

• 另一方面，Map 只有一种创建方式。

var map = new Map();//Empty 
console.log(map); 
var map = new Map([[1, "Sam"], [2, "John"]]); // 1-> Sam, 2->John 
console.log(map); 

输出:

Map(0)
Map(2)

• 访问元素:Map使用其内置的get()方法访问其元素。

map.get(1);

• 对象简单地使用key名称和句点操作符来访问其元素。

obj.id;
obj[id];

• 检查键是否已经存在:Map使用它内置的has()函数来完成此操作。

map.has(1);//returns boolean value true or false.

• Object 使用 ‘===‘ 运算符执行任务。

var doExist = obj.1 === undefined; //返回布尔值。

• 添加新元素：Map 使用 set() 方法来添加新元素。

map.set(4, 5); //{5->4, 7->9, 4->5}

• 在对象中，可以直接添加。

obj["Demo"]="Map vs Object"; //{1->Object Name, 2->Test, Demo->Map vs Object}

• 获取大小：Map 会自动更新其大小并获取最简单的大小。

console.log(map.size);

• 在对象中，需要使用 Object.keys() 手动计算大小。

console.log(Object.keys(obj).length);

因此，我们可以看到 Map 具有更好的性能和较少的编写代码结构，这使它比 Object 更具优势。然而，有些情况下需要使用 object。让我们来看一下。

何时何地使用 object：

• 对于需要简单结构来存储数据且所需键的类型为整数、字符串或符号的情况，object 是一个很好的选择。
• 需要对单个属性元素应用单独逻辑的场景中，object 显然是首选。
• JSON 直接支持 object，但不支持 map（尚未支持）。
• Map 是完全散列而 object 不只是如此。

尽管 Map 在对象上具有更多优势，但最终取决于所使用的数据类型和需要执行的操作。

然而，尽管 Map 对象具有诸多优势，但它无法取代 JavaScript 中的 Object，因为 Object 远不仅仅是散列表。如果有其他选择，就不应该仅仅将其用于散列的目的。