多年来，程序员一直在使用Object和Array来存储数据，而且这种趋势不仅限于JavaScript。除了这两个选项之外，没有其他选项可以存储多个值和处理数据结构。但是，使用Object和Array时有几个限制，例如：Array可以存储重复的元素。没有办法像Array那样找到Object的长度。无论插入顺序如何，只能将字符串存储在Object中。开发人员必须根据用例选择数组或对象。像Lodash这样的第三方库被用来增强数组的功能。随着2015年ES6的发布，情况开始有所改善。ES6引入了对Map和Set的支持，旨在克服上述限制。什么是集合和映射？如前所述，这两个特性都是在ES6版本的JavaScript中引入的。Set是唯一元素的有序集合。“唯一元素”是最重要的，因为它意味着一个Set不能存储重复的元素。但它没有键值对系统。Map是Array和Object数据结构的组合。它和Object一样是一组键值对，但它也会记住插入格式并具有length(.size)属性。集合声明和初始化：集合可以这样初始化。constset=newSet();constset=newSet();在集合中添加和删除元素：您可以使用.add()方法轻松地将元素插入集合。constset=newSet();set.add('John');set.add('Martha')set.add('Bryan');set.add('John');//set={'John','Martha','Bryan'}JavaScript中的集合借用了数学集合的许多属性并且只包含独特的元素。删除元素也很简单，使用.delete()方法删除单个元素，或者使用.clear()方法删除所有元素。set.add('John');set.add('Martha')set.add('Bryan');set.delete('Martha')//set={'John','Bryan'}set.clear();//removesalltheelementSizeofSet：使用.size，你可以轻松找到有用的Setsizes。set.add('a')set.add('b');set.add('c');console.log(set.size)//=>3accessingelementsinSet:SetistryingtologOr访问其值时有所不同。您可以记录数组和查看元素，但这不适用于集合。vararr=[1,2,3];constset=newSet(arr);console.log(set)//=>[objectSet]console.log(arr)//=>(3)[1,2,3]为了访问Set，我们需要一个SetIterator()来获取所有值。JavaScript提供了一个属性.values()来获取一个迭代器，然后我们可以使用该迭代器和一个循环来获取所有的值。如以下代码片段所示：vararr=[1,2,3];constset=newSet(arr);variator=set.values()console.log(iterator.next().value)//1检索所有元素是更简单最好的方法是像这样使用.forEach()：vararr=[1,2,3];constset=newSet(arr);set.forEach(v=>console.log(v))output:123另外，你可以使用.has()方法来检查某个值是否存在，如果找到该元素，它将返回true。vararr=[1,2,3];constset=newSet(arr);console.log(set.has(1));//true值得一提的是，虽然Set不支持键值对元素，但是Set上有key()和entries()等方法。SetvsArraySet和Array倾向于执行和处理相同的操作，但存在一些差异。最大的区别是Set不能像Array一样有重复项，并且Set提供了一种更简单的删除项目的方法。此外，Set的元素可以按插入顺序迭代。与数学集合一样，JavaScript中的集合也可以用于执行并集和交集等操作，这可以在合并数据或查找两个Set中的公共元素时使用。Map的初始化和声明：和Set类似，Map也可以用同样的方式声明。constmap=newMap();从Map中添加和删除元素：Map支持类似于Object的键值对。所以在增值的同时，我们还需要提供一把钥匙。这与我们在Set中看到的不一样。constmap=newMap();map.set('Name','iPhone');//map.set(key,value)formatmap.set('Brand','Apple');map.set('Price','1000');要从Map中删除一个值，我们可以简单地将键传递给.delete()属性。constmap=newMap();map.set('Name','iPhone');map.set('Brand','Apple');map.set('Price','$1000');map.delete('Price');//removestheelementwithkey'Price'类似于Set，可以使用.clear()来移除所有元素。map.clear()//removesalltheelementMapsize：Map的大小（长度）可以使用.size轻松获取。constmap=newMap();map.set('Name','iPhone');map.set('Brand','Apple');map.set('Price','$1000');console.log(map.size)//=>3访问Map中的元素：Map为我们提供了.get()方法，通过将key作为参数传入该方法，可以快速获取值。constmap=newMap();map.set('Name','iPhone');map.set('Brand','Apple');map.set('Price','$1000');console.log(map.get('Name'));//iPhoneconsole.log(map.get('Brand'));//Apple但如果你只想要键、值或两者呢？Map有.keys()、.values()和.entries()分别实现相同的功能。在上面的代码中使用相同的Map：console.log(map.keys());//iterator{'Name','Brand',Price'}console.log(map.values());//iterator{'iPhone','Apple','$1000'}console.log(map.entries());//iterator{'Name':'iPhone','Brand':'Apple',Price':'$1000'}Map的迭代也很简单：//withfor-eachmap.forEach((value,key)=>{console.log(`${key}is${value}yearsold!`);});//withfor-offor(const[key,value]ofmap){console.log(`${key}:${value}`);}此外，您可以使用.has()属性并传递钥匙。varmap=newMap();map.set('age',19);console.log(map.has('age'))//truesince'age'keyispresent如果你决定将object转换为map，JavaScript已经做好了它。之前我们使用.entries()来获取所有的键值对，但是这次我们将使用Object的方法。constmyObject={'Age':'25','Gender':'Male','Nationality':'Australian'};constmyMap=newMap(Object.entries(myObject));//objecttomapconstanotherObject=Object.fromEntries(myMap)//maptoobject您可以轻松地将地图转换为对象，如上所示。要将Map转换为Array，可以使用array.from(myMap)。MapvsArray&ObjectsMap似乎解决了Array和Object的许多缺点，比如它处理更复杂操作的能力。Map就像是Array和Object的混合体。它有一个类似数组的大小属性，以键值对格式存储元素。除此之外，它还提供了.has()之类的方法来检查元素是否存在，这可以节省大量时间。此外，它不要求密钥是字符串类型。您甚至可以将对象用作键来帮助您编写更好的代码。虽然Array和Object已成为存储集合元素和键值对的事实标准，但通过引入Map和Set，您可以为您的代码提供一种有趣的方法。Set和Map是JavaScript提供的用于存储复杂数据结构的新标准。此外，使用这些数据结构还消除了使用第三方库（如Lodash）的需要，因为这些新数据结构默认提供了.has()和.delete()等方法。图片来源：unsplashArray和Object在任何意义上都没有过时，但使用Set和Map绝对是处理数据的更好方法，尤其是在构建大型复杂应用程序时。
