Map 和 Set 最基本的用法演示-优快云博客

本文链接：https://blog.youkuaiyun.com/VVVVV16/article/details/126895618

本文详细介绍了JavaScript中的Map和Set数据结构。Map对象允许存储任意类型的键值对，解决了对象作为键的问题，支持get、set、has、delete等操作。Set对象则用于存储不重复的值，可用于数组去重，提供了add、delete、clear等方法。通过实例展示了这两个数据结构的使用和功能，包括遍历、长度获取等操作。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Map:

<script>
  //普通的对象
  let arr = {
    'true': 1,
    true: 2
  }
  console.log(arr);//最终的结果是 true:2   发现少了  数据是会丢失的
  //Map对象
  let a = [1]
  let newarr = new Map();
  newarr.set(true, 'aa');
  newarr.set('true', 'bb');
  // newarr.set([1], 'cc');
  newarr.set(a, 'cc')
  newarr.set(1, 'dd');
  newarr.set('1', 'ee');
  console.log([...newarr]);//[[键，值]，...]
  //.............................................用get  获取对应键的值
  console.log(newarr.get(1));//dd
  // console.log(newarr.get([1]));//undefined 因为数组之间的对比没有意义 建议把[1],{n:1},funcation(){}这些付给一个新的变量
  console.log(newarr.get(a));//cc 这样就有意义了
  console.log(newarr.get('1'));//ee
  //............................................has  用来判断是否有这个键
  console.log(newarr.has(true));//true
  newarr.delete(true)  //删除指定的键和值
  console.log(newarr);
  //....................................
  /*   newarr.clear()
    console.log(newarr); */ //清除所有的
  console.log(newarr.size);//长度
  console.log(newarr.keys());
  console.log(newarr.values());
  console.log(newarr.entries());
  newarr.forEach((val, key) => {
    console.log(val);//第一个参数是值
    console.log(key);//第二个是键
  })

</script>

Set:

<script>
  let arr = [1, 2, 3, 4, 5, 6, 6]
  let newarr = new Set(arr);
  console.log(newarr);//我们直接把数组放进去  就能完成去重
  let arr2 = [...newarr]
  console.log(arr2);//将去重的结果 放在一个新的数组中就得到了一个新的数组
  newarr.add('hello')//使用set的add方法   我们能添加一个新的值
  arr2 = [...newarr]
  console.log(arr2);
  newarr.delete(3)//使用delete方法  我们就能删除某个值
  arr2 = [...newarr]
  console.log(arr2);
  newarr.clear()//使用clear方法   我们就能删除所有的值
  arr2 = [...newarr]
  console.log(arr2);
  //---------------------------------------------
  let str = 'hello'
  let newstr = new Set(str)
  console.log(newstr);
  let str2 = [...newstr].join('')
  console.log(str2);//我们同样可以利用set  给 str去重
  //-------------------------------
  console.log(newstr.size);  //set的  方法  直接看到 长度
  console.log(newstr.keys()); //set的 方法  获取键
  console.log(newstr.values());//set的  方法  获取值
  console.log(newstr.entries());//set的方法   获得键和值的对象
  newstr.forEach((item) => {
    console.log(item);
  })//循环遍历 
</script>