简介:

Object: A data structure in which data is stored as key value pairs. In an object the key has to be a number, string, or symbol. The value can be anything so also other objects, functions, etc. An object is a nonordered data structure, i.e. the sequence of insertion of key value pairs is not remembered ES6 Map: A data structure in which data is stored as key value pairs. In which a unique key maps to a value. Both the key and the value can be in any data type. A map is an iterable data structure. This means that the sequence of insertion is remembered and that we can access the elements in e.g. a for..of loop.

关键的不同点:

Map是有序的且可迭代的，而object不是有序的且不可迭代的(也就是说它们没有[符号]。迭代器]属性。但是，你可以在语法中使用for..遍历键。) 我们可以将任何类型的数据作为Map键，而对象只能将数字、字符串或符号作为键。 Map继承自Map.prototype。这提供了各种实用函数和属性，使Map对象的工作更加容易。

例子:

对象:

让obj = {}; //添加属性到对象 obj。Prop1 = 1; Obj [2] = 2; //获取对象属性的nr console.log(种(obj) . length) //删除属性 删除obj [2] console.log (obj)

Map:

const myMap = new Map(); const keyString = 'a string', keyObj = {}, keyFunc = function() {}; // setting the values myMap.set(keyString, "value associated with 'a string'"); myMap.set(keyObj, 'value associated with keyObj'); myMap.set(keyFunc, 'value associated with keyFunc'); console.log(myMap.size); // 3 // getting the values console.log(myMap.get(keyString)); // "value associated with 'a string'" console.log(myMap.get(keyObj)); // "value associated with keyObj" console.log(myMap.get(keyFunc)); // "value associated with keyFunc" console.log(myMap.get('a string')); // "value associated with 'a string'" // because keyString === 'a string' console.log(myMap.get({})); // undefined, because keyObj !== {} console.log(myMap.get(function() {})) // undefined, because keyFunc !== function () {}

来源:中数

除了其他答案之外，我还发现map比对象操作起来更笨拙和冗长。

obj[key] += x
// vs.
map.set(map.get(key) + x)

这一点很重要，因为较短的代码读起来更快，表达更直接，并且更好地记在程序员的脑海里。

另一方面:因为set()返回的是映射，而不是值，所以不可能链式赋值。

foo = obj[key] = x;  // Does what you expect
foo = map.set(key, x)  // foo !== x; foo === map

调试地图也更加痛苦。下图中，你实际上看不到地图中的键是什么。你必须编写代码才能做到这一点。

对象可以被任何IDE计算:

我认为到目前为止答案中还没有提到以下几点，我认为它们值得一提。

地图可以更大

在Chrome中，我可以使用Map获得1670万个键/值对，而使用常规对象可以获得1110万个键/值对。带地图的情侣数量几乎增加了50%。它们在崩溃前都占用了大约2gb的内存，所以我认为可能与chrome的内存限制有关(是的，尝试填充2个地图，在崩溃前你只能得到830万对)。你可以用下面的代码自己测试它(显然，分开运行它们，而不是同时运行):

var m = new Map();
var i = 0;
while(1) {
    m.set(((10**30)*Math.random()).toString(36), ((10**30)*Math.random()).toString(36));
    i++;
    if(i%1000 === 0) { console.log(i/1000,"thousand") }
}
// versus:
var m = {};
var i = 0;
while(1) {
    m[((10**30)*Math.random()).toString(36)] = ((10**30)*Math.random()).toString(36);
    i++;
    if(i%1000 === 0) { console.log(i/1000,"thousand") }
}

对象已经有了一些属性/键

这个问题以前让我犯过错误。常规对象有toString, constructor, valueOf, hasOwnProperty, isPrototypeOf和其他一堆预先存在的属性。对于大多数用例来说，这可能不是一个大问题，但它曾经给我带来过问题。

地图会变慢:

由于.get函数调用开销和缺乏内部优化，Map在某些任务中可能比普通的旧JavaScript对象慢得多。

简介:

Object: A data structure in which data is stored as key value pairs. In an object the key has to be a number, string, or symbol. The value can be anything so also other objects, functions, etc. An object is a nonordered data structure, i.e. the sequence of insertion of key value pairs is not remembered ES6 Map: A data structure in which data is stored as key value pairs. In which a unique key maps to a value. Both the key and the value can be in any data type. A map is an iterable data structure. This means that the sequence of insertion is remembered and that we can access the elements in e.g. a for..of loop.

关键的不同点:

Map是有序的且可迭代的，而object不是有序的且不可迭代的(也就是说它们没有[符号]。迭代器]属性。但是，你可以在语法中使用for..遍历键。) 我们可以将任何类型的数据作为Map键，而对象只能将数字、字符串或符号作为键。 Map继承自Map.prototype。这提供了各种实用函数和属性，使Map对象的工作更加容易。

例子:

对象:

让obj = {}; //添加属性到对象 obj。Prop1 = 1; Obj [2] = 2; //获取对象属性的nr console.log(种(obj) . length) //删除属性 删除obj [2] console.log (obj)

Map:

const myMap = new Map(); const keyString = 'a string', keyObj = {}, keyFunc = function() {}; // setting the values myMap.set(keyString, "value associated with 'a string'"); myMap.set(keyObj, 'value associated with keyObj'); myMap.set(keyFunc, 'value associated with keyFunc'); console.log(myMap.size); // 3 // getting the values console.log(myMap.get(keyString)); // "value associated with 'a string'" console.log(myMap.get(keyObj)); // "value associated with keyObj" console.log(myMap.get(keyFunc)); // "value associated with keyFunc" console.log(myMap.get('a string')); // "value associated with 'a string'" // because keyString === 'a string' console.log(myMap.get({})); // undefined, because keyObj !== {} console.log(myMap.get(function() {})) // undefined, because keyFunc !== function () {}

来源:中数

根据MDN:

Map对象可以按插入顺序迭代其元素——for..of循环每次迭代将返回一个[key, value]数组。

and

Objects are similar to Maps in that both let you set keys to values, retrieve those values, delete keys, and detect whether something is stored at a key. Because of this, Objects have been used as Maps historically; however, there are important differences between Objects and Maps that make using a Map better. An Object has a prototype, so there are default keys in the map. However, this can be bypassed using map = Object.create(null). The keys of an Object are Strings, where they can be any value for a Map. You can get the size of a Map easily while you have to manually keep track of size for an Object.

Map

按顺序迭代是开发人员一直想要的功能，部分原因是它可以确保在所有浏览器中都具有相同的性能。所以对我来说，这是一个大问题。

myMap.has(key)方法将特别方便，还有myMap.has(key)方法。大小属性。

这是我记住它的一个简单方法:KOI

Keys. Object key is strings or symbols. Map keys can also be numbers (1 and "1" are different), objects, NaN, etc. It uses === to distinguish between keys, with one exception NaN !== NaN but you can use NaN as a key. Order. The insertion order is remembered. So [...map] or [...map.keys()] has a particular order. Interface. Object: obj[key] or obj.a (in some language, [] and []= are really part of the interface). Map has get(), set(), has(), delete() etc. Note that you can use map[123], but that is using it as a plain JavaScript object.