zoukankan      html  css  js  c++  java
  • 深入理解ES6之—set与map

    Set是无重复值的有序列表。Set会自动移除重复的值,因此你可以使用它来过滤数组中重复的值并返回结果。

    Map是有序的键值对,其中的键允许是任何类型。

    Set和Map是es6新增的两个数据集合。

    Set集合

    es6新增了set类型,这是一种无重复值的有序列表。Set允许对它包含的数据进行快速访问。

    创建Set并添加项目

    Set通过new Set()来创建,调用add()方法就可以向Set中添加项目。检查size属性还能查看其中包含多少项。

    let set = new Set();
    set.add(5);
    set.add("5");
    console.log(set.size);//2
    

    Set不会使用强制类型转换来判断值是否重复。还可以向Set添加多个对象,他们不会被合并为同一项。

    let set = new Set();
    
    let key1 = {};
    let key2 = {};
    
    set.add(key1);
    set.add(key2);
    
    console.log(set.size);//2
    

    如果add()方法用相同的值进行了多次调用,那么在第一次之后的调用实际上会被忽略。

    let set = new Set();
    
    set.add(5);
    set.add("5");
    set.add(5);//被忽略
    
    console.log(set.size);//2
    

    你可以使用数组来初始化一个Set,并且Set构造器确保不会重复使用这些值。

    let set = new Set([1,2,3,4,5,2,6,5,5,5]);
    console.log(set.size);//6
    

    虽然数值5在数组中出现了四次,但是Set中只有一个5

    你可以使用has()方法来测试某个值是否存在于set中

    let set = new Set();
    
    let key1 = {};
    let key2 = {};
    let key3 = {};
    
    set.add(key1);
    set.add(key2);
    
    console.log(set.has(key1));//true
    console.log(set.has(key3));//false
    

    移除值

    使用delete()方法来移除单个值或者调用clear()方法将所有值从Set中移除。

      let set = new Set([1, 2, 3, 4, 5, 2, 6, 5, 5, "5"]);
    
    console.log(set);
    
    set.delete(5);
    
    console.log(set.has(5));//false
    
    set.clear();
    
    console.log(set.size);//0
    

    Set 上的forEach()方法

    forEach()方法还会被传递一个回调函数,该回调函数接收三个参数:

    1. Set中下个位置的值
    2. 与第一个参数相同的值
    3. 目标Set本身

    由于Set没有键,为了使forEach方法与数组和map的forEach方法一致:将Set中的每一项同时认定为键与值。

    let set = new Set([1, 2]);
    
    set.forEach(function(value, key, ownerSet) {
        console.log(`${key} ${value}`)
        console.log(ownerSet === set);
    })
    

    将Set转换为数组

    let arr = [1,2,4,3,2,5,5];
    let set = new Set(arr);
    
    let arr1 = [...set];
    console.log(arr1);
    

    Map集合

    ES6的Map类型是键值对的有序列表,而键和值都可以是任意类型。键的比较使用的是Object.is(),因此你可以将5与“5”同时作为键,因为他们类型不同。

    可以调用set方法并传递一个键与一个关联的值,来给Map添加项;此后使用键名来调用get()方法便能提取对应的值。

    let map = new Map();
    map.set("name", "cc");
    map.set("age", 23);
    
    console.log(map.get("name"));//cc
    console.log(map.get("age"));//23
    

    也可以使用对象作为键

    let map = new Map();
    let key1 = {};
    let key2 = {};
    
    map.set(key1, 5);
    map.set(key2, 8);
    
    console.log(map.get(key1));//5
    console.log(map.get(key2));//8
    

    Map的方法和属性

    1. has(key)
    2. delete(key)
    3. clear()
    4. size

    Map的初始化

    你能将数组传递给Map构造器,以便使用数据来初始化一个Map。该数组中的每一项也必须是数组,内部数组的首个项会作为键,第二项则为对应值。因此整个Map就被这些双项数组填充。

    let map = new Map([
        ["name", "cc"],
        ["age", 26]
    ]);
    
    console.log(map.has("name"));//true
    console.log(map.get("name"));//cc
    console.log(map.has("age"));//true
    console.log(map.get("age"));//26
    console.log(map.size);//2
    

    Map上的forEach()方法

    let map = new Map([
        ["name", "cc"],
        ["age", 26]
    ]);
    
    map.forEach(function(value, key, source) {
        console.log(`${key}的值是${value}`);
        console.log(source === map);
    })
    
  • 相关阅读:
    linux命令-ps
    solr参数说明
    CAP原理和BASE思想
    java多线程文件上传服务器
    swift的简介
    浅谈对【OSI七层协议】的理解
    手写简易WEB服务器
    JVM知识整理和学习(转载并修改)
    多线程学习笔记六
    多线程学习笔记五
  • 原文地址:https://www.cnblogs.com/xzsty/p/7814798.html
Copyright © 2011-2022 走看看