js中Map和Set的用法及区别是什么

今天小编给大家分享一下js中Map和Set的用法及区别是什么的相关知识点，内容详细，逻辑清晰，相信大部分人都还太了解这方面的知识，所以分享这篇文章给大家参考一下，希望大家阅读完这篇文章后有所收获，下面我们一起来了解一下吧。

首先了解一下 Map

Map 是一组键值对的结构，和 JSON 对象类似。

(1) Map数据结构如下

这里我们可以看到的是Map的数据结构是一个键值对的结构

(2) key 不仅可以是字符串还可以是对象

var obj ={name:"小如",age:9}let map = new Map()map.set(obj,"111")

打印结果如下

(3) Map常用语法如下

//初始化`Map`需要一个二维数组(请看 Map 数据结构)，或者直接初始化一个空`Map` let map = new Map();//添加key和value值map.set('Amy','女')map.set('liuQi','男')//是否存在key，存在返回true,反之为falsemap.has('Amy') //truemap.has('amy') //false//根据key获取valuemap.get('Amy') //女//删除 key为Amy的valuemap.delete('Amy')map.get('Amy') //undefined  删除成功

(4) 一个key只能对应一个value，多次对一个key放入value，后面的值会把前面的值覆盖掉

var map =new Mapmap.set('Amy',"女")map.set('Amy',"男")console.log(map)

打印结果如下

再来了解一下 Set

Set 对象类似于数组，且成员的值都是唯一的

(1) 打印出的数据结构如下

这里打印出来是一个对象

(2) 最常用来去重使用，去重方法有很多但是都没有它运行的快。

var arr=[1,3,4,2,5,1,4]// 这里原本是一个对象用了es6的语法 转化成了数组，就是转化数组之前已经过滤掉了重复的元素了var arr2=[...new Set(arr)] //[1,3,4,2,5]

(3) Set常用语法如下

//初始化一个Set ，需要一个Array数组，要么空Setvar set = new Set([1,2,3,5,6]) console.log(set)  // {1, 2, 3, 5, 6}//添加元素到Set中set.add(7) //{1, 2, 3, 5, 6, 7}//删除Set中的元素set.delete(3) // {1, 2, 5, 6, 7}//检测是否含有此元素，有为true，没有则为falseset.has(2) //true

总结Map和Set的区别

(1) 这两种方法具有极快的查找速度;那么下面我们来对比一下Map，Set，Array 的执行时间

//首先初始化数据var lng=100var arr =new Array(lng).fill(2)var set =new Set(arr)let map =new Map()for(var i=0;i<lng;i++){arr[i]=imap.set(i,arr[i])}// Arrayconsole.time()for(var j=0;j<lng;j++){arr.includes(j)}console.timeEnd()  //default: 0.01220703125 ms// Setconsole.time()for(var j=0;j<lng;j++){set.has(j)}console.timeEnd()  // default: 0.005859375 ms// Mapconsole.time()for(var j=0;j<lng;j++){map.has(j)}console.timeEnd()// default: 0.007080078125 ms

通过以上几种方法我们可以看到，Set执行时间最短，那么查找速度最快，当然了Set 和 Map的查找速度都很快想差不大，所以说这两种方法具有极快的查找速度。

(2) 初始化需要的值不一样，Map需要的是一个二维数组，而Set 需要的是一维 Array 数组

(3) Map 和 Set 都不允许键重复

(4) Map的键是不能修改，但是键对应的值是可以修改的；Set不能通过迭代器来改变Set的值，因为Set的值就是键。

(5) Map 是键值对的存在，值也不作为健；而 Set 没有 value 只有 key，value 就是 key；

以上就是“js中Map和Set的用法及区别是什么”这篇文章的所有内容，感谢各位的阅读！相信大家阅读完这篇文章都有很大的收获，小编每天都会为大家更新不同的知识，如果还想学习更多的知识，请关注编程网精选频道。