ES6基础语法之Set & Map

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/TDCQZD/article/details/82390741

一、 Set

1、基本介绍
Set 对象允许你存储任何类型的唯一值,无论是原始值或者是对象引用。NaN和undefined都可以被存储在Set 中, NaN之间被视为相同的值(尽管 NaN !== NaN)
语法:new Set([iterable]);
参数:iterable
如果传递一个可迭代对象,它的所有元素将被添加到新的 Set中。如果不指定此参数或其值为null,则新的 Set为空
返回值:一个新的Set对象。

2、 size属性
返回Set对象的值的个数

3、 add

Set.prototype.add(value)

在Set对象尾部添加一个元素。返回该Set对象。

4、 delete

Set.prototype.delete(value)

移除Set的中与这个值相等的元素,(即如果该元素存在,返回true,否则返回false)

5、 clear

Set.prototype.clear()

移除Set对象内的所有元素。

6、 has

Set.prototype.has(value)

返回一个布尔值,表示该值在Set中存在与否。

7、 values

    Set.prototype.values()

返回一个新的迭代器对象,该对象包含Set对象中的按插入顺序排列的所有元素的值。

8、 keys

Set.prototype.keys()

与values()方法相同,返回一个新的迭代器对象,该对象包含Set对象中的按插入顺序排列的所有元素的值。

9、 entries

Set.prototype.entries()

返回一个新的迭代器对象,该对象包含Set对象中的按插入顺序排列的所有元素的值的[value, value]数组。为了使这个方法和Map对象保持相似, 每个值的键和值相等。

10、forEach

Set.prototype.forEach(callbackFn[, thisArg])

按照插入顺序,为Set对象中的每一个值调用一次callBackFn。如果提供了thisArg参数,回调中的this会是这个参数。

11、 数组去重

var set= new Set(arr2);  arr2:需要去重的数组  

代码示例:

<script>
   /* let set = new Set([1,2,3,4,4,NaN,NaN])
    console.log(set);*/

   let set = new Set()
   //C
   set.add(1);
   set.add(2);
   set.add(3);
   console.log(set,set.size);

   //D
    /*set.delete(1);
    console.log(set);
    set.clear()
    console.log(set);*/

    //R
   console.log(set.has(11));
   for (let item of set.entries()){
       console.log(item);
   }

   set.forEach((item)=>{
       console.log(item)
   })

    for(let item of set){
       console.log(item)
    }


</script>

效果图:
这里写图片描述

二、 Map

1、基本介绍
Map 对象保存键值对。任何值(对象或者原始值) 都可以作为一个键或一个值
语法new Map([iterable])
参数:iterable
Iterable 可以是一个数组或者其他 iterable 对象。一般参数为具有两个元素的数组的数组。 每个数组中的两个元素都会被当做键值对添加到新的 Map。null 会被当做 undefined。
返回值:一个新的Map对象。

2、 size属性
返回Map对象的键/值对的数量

3、set

        Map.prototype.set(key, value)

设置Map对象中键的值。返回该Map对象。

4、 get

        Map.prototype.get(key)

返回键对应的值,如果不存在,则返回undefined。

5、 delete

Map.prototype.delete(key)

移除任何与键相关联的值,并且返回该值,该值在之前会被Map.prototype.has(key)返回为true。之后再调用Map.prototype.has(key)会返回false。

6、 clear

Map.prototype.clear()

移除Map对象的所有键/值对 。

7、 has

Map.prototype.has(key)

返回一个布尔值,表示Map实例是否包含键对应的值

8、 keys

Map.prototype.keys()

返回一个新的 Iterator对象, 它按插入顺序包含了Map对象中每个元素的键

9、 values

Map.prototype.values()

返回一个新的Iterator对象,它按插入顺序包含了Map对象中每个元素的值

10、 entries

Map.prototype.entries()

返回一个新的 Iterator 对象,它按插入顺序包含了Map对象中每个元素的 [key, value] 数组。

11、 forEach

Map.prototype.forEach(callbackFn[, thisArg])

按插入顺序,为 Map对象里的每一键值对调用一次callbackFn函数,返回value值。如果为forEach提供了thisArg,它将在每次回调中作为this值。

代码示例:

<script>
    /*let map = new Map([["a","a-val"],["b","b-val"],["c","c-val"]]);
    console.log(map)*/

    let map = new Map();
    map.set("a","a-val")
    map.set("b","b-val")
    map.set("c","c-val")
    console.log(map,map.get("b"))

    for (let item of map){
        console.log(item);
    }

    for(item of map.values()){
        console.log(item)
    }

    map.forEach( (item)=>{
        console.log(this,item)
    },{test:"test"})

</script>

效果图:
这里写图片描述

三、 Objects 和 maps 的比较

Object 和 Map 类似的是,它们都允许你按键存取一个值、删除键、检测一个键是否绑定了值。因此过去我们一直都把对象当成 Map 使用。不过 Map 和 Object 有一些重要的区别,在下列情况里 Map 会是更好的选择:

  • 一个对象的键只能是字符串或者 Symbols,但一个 Map 的键可以是任意值,包括函数、对象、基本类型
  • 你可以通过 size 属性直接获取一个 Map 的键值对个数,而 Object 的键值对个数只能手动计算。
  • Map 是可迭代的,而 Object 的迭代需要先获取它的键数组然后再进行迭代。一个Map对象以插入顺序迭代其元素 — 一个 for…of 循环为每次迭代返回一个[key,value]数组
  • Object 都有自己的原型,所以原型链上的键名有可能和对象上的键名产生冲突。虽然 ES5 开始可以用 map = Object.create(null) 来创建一个没有原型的对象,但是这种用法不太常见。
  • Map 在涉及频繁增删键值对的场景下会有些性能优势。

猜你喜欢

转载自blog.csdn.net/TDCQZD/article/details/82390741
今日推荐