• JavaScript中的Map、Set及其遍历


     

    Map

     Map是一组键值对的结构,具有极快的查找速度。

     Map的定义。

    //空map设值key-value
    var m = new Map();
    m.set("XiaoMing",99);
    m.set("XiaoHong",66);
    //构造参数传key-value
    var m = new Map([['XiaoMing', 99], ['XiaoHong', 66]]);

      Map中的方法

    var m = new Map(); // 空Map
    m.set('XiaoMing', 99); // 添加新的key-value
    m.has('XiaoMing'); // 是否存在key 'XiaoMing': true
    m.get('XiaoMing'); // 99
    m.delete('XiaoMing'); // 删除key 'XiaoMing'
    m.get('XiaoMing'); // undefined

     对一个key重复设值,后面的值会将前面的值覆盖。

    var m = new Map();
    m.set('XiaoMing', 99);
    m.set('XiaoMing', 98);
    m.get('XiaoMing'); // 98

    Set

     Set和Map类似,但set之存储key,且key不重复。

     Set的创建。

    var s1 = new Set(); // 空Set
    s1.add(1);
    s1.add(2);
    s1.add(3);
    
    var s2 = new Set([1, 2, 3]); // 含1, 2, 3

     插入重复的值,set会将重复的值进行过滤

    var s = new Set([1, 2, 3]);
    s.add(3);
    >>s; // Set{1,2,3}
    s.delete(3);
    >>s; // Set([1,2]);

    Map及Set的遍历

     Array可以采用下标进行循环遍历,Map和Set就无法使用下标。为了统一集合类型,ES6标准引入了iterable类型,Array、Map、Set都属于iterable类型。

     具有iterable类型的集合可以通过新的for ... of循环来遍历。

    复制代码
    var a = ['A', 'B', 'C'];
    var s = new Set(['A', 'B', 'C']);
    var m = new Map([[1, 'x'], [2, 'y'], [3, 'z']]);
    for (var x of a) { // 遍历Array
        alert(x);
    }
    for (var x of s) { // 遍历Set
        alert(x);
    }
    for (var x of m) { // 遍历Map
        alert(x[0] + '=' + x[1]);
    }
    复制代码

    更好的遍历:forEach

     forEach是iterable内置的方法,它接收一个函数,每次迭代就自动回调该函数。

    复制代码
    var a = ['A', 'B', 'C'];
    a.forEach(function (element, index, array) {
        // element: 指向当前元素的值
        // index: 指向当前索引
        // array: 指向Array对象本身
        alert(element);
    });
    复制代码

     SetArray类似,但Set没有索引,因此回调函数的前两个参数都是元素本身:

    var s = new Set(['A', 'B', 'C']);
    s.forEach(function (element, sameElement, set) {
        alert(element);
    });

     Map的回调函数参数依次为valuekeymap本身:

    var m = new Map([[1, 'x'], [2, 'y'], [3, 'z']]);
    m.forEach(function (value, key, map) {
        alert(value);
    });
  • 相关阅读:
    JavaScript的执行
    关于k阶裴波那契序列的两种解法
    科普 eclipse中的Java build
    [BZOJ 1037] 生日聚会Party
    [POJ 1185] 炮兵阵地
    [POJ 1935] Journey
    [POJ 2397] Spiderman
    [POJ 2373][BZOJ 1986] Dividing the Path
    [POJ 3378] Crazy Thairs
    [POJ 2329] Nearest number-2
  • 原文地址:https://www.cnblogs.com/williamjie/p/9765815.html
Copyright © 2020-2023  润新知