zoukankan      html  css  js  c++  java
  • ES6知识点整理之----Map

    1、类似于对象,也是键值对的集合,但是“键”的范围不限于字符串,各种类型的值(包括对象)都可以当作键。也就是说,Object 结构提供了“字符串—值”的对应,Map 结构提供了“值—值”的对应,是一种更完善的 Hash 结构实现。

    const m = new Map();
    const o = {p: 'Hello World'};
    
    m.set(o, 'content')
    m.get(o) // "content"
    
    m.has(o) // true
    m.delete(o) // true
    m.has(o) // false

    2、作为构造函数,Map 也可以接受一个数组作为参数。该数组的成员是一个个表示键值对的数组。事实上,不仅仅是数组,任何具有 Iterator 接口、且每个成员都是一个双元素的数组的数据结构都可以当作Map构造函数的参数。

    const map = new Map([
      ['name', '张三'],
      ['title', 'Author']
    ]);
    
    map.size // 2
    map.has('name') // true
    map.get('name') // "张三"
    map.has('title') // true
    map.get('title') // "Author"
    • 如果对同一个键多次赋值,后面的值将覆盖前面的值。
    • 如果读取一个未知的键,则返回undefined
    • Map 的键实际上是跟内存地址绑定的,只要内存地址不一样,就视为两个键。
    • 如果 Map 的键是一个简单类型的值(数字、字符串、布尔值),则只要两个值严格相等,Map 将其视为一个键
       
    • size 属性:返回 Map 结构的成员总数。
    • set(key, value):设置键名key对应的键值为value,然后返回整个 Map 结构。如果key已经有值,则键值会被更新,否则就新生成该键。
    • get(key):读取key对应的键值,如果找不到key,返回undefined
    • has(key):返回一个布尔值,表示某个键是否在当前 Map 对象之中。
    • delete(key):删除某个键,返回true。如果删除失败,返回false
    • clear():清除所有成员,没有返回值。
    • keys()返回键名的遍历器。
    • values()返回键值的遍历器。
    • entries()返回所有成员的遍历器。
    • forEach()遍历 Map 的所有成员。

    3、与其他数据结构的互相转换

    Map 转为数组:使用扩展运算符(...

    const myMap = new Map()
      .set(true, 7)
      .set({foo: 3}, ['abc']);
    [...myMap]
    // [ [ true, 7 ], [ { foo: 3 }, [ 'abc' ] ] ]

    数组 转为 Map:将数组传入 Map 构造函数,就可以转为 Map。

    new Map([
      [true, 7],
      [{foo: 3}, ['abc']]
    ])
    // Map {
    //   true => 7,
    //   Object {foo: 3} => ['abc']
    // }

    Map 转为对象:如果所有 Map 的键都是字符串,它可以无损地转为对象。如果有非字符串的键名,那么这个键名会被转成字符串,再作为对象的键名。

    function strMapToObj(strMap) {
      let obj = Object.create(null);
      for (let [k,v] of strMap) {
        obj[k] = v;
      }
      return obj;
    }
    
    const myMap = new Map()
      .set('yes', true)
      .set('no', false);
    strMapToObj(myMap)
    // { yes: true, no: false }

    对象转为 Map

    function objToStrMap(obj) {
      let strMap = new Map();
      for (let k of Object.keys(obj)) {
        strMap.set(k, obj[k]);
      }
      return strMap;
    }
    
    objToStrMap({yes: true, no: false})
    // Map {"yes" => true, "no" => false}

    Map 转为 JSON:一种情况是,Map 的键名都是字符串,这时可以选择转为对象 JSON。另一种情况是,Map 的键名有非字符串,这时可以选择转为数组 JSON。

    function strMapToJson(strMap) {
      return JSON.stringify(strMapToObj(strMap));
    }
    
    let myMap = new Map().set('yes', true).set('no', false);
    strMapToJson(myMap)
    // '{"yes":true,"no":false}'
    
    
    function mapToArrayJson(map) {
      return JSON.stringify([...map]);
    }
    
    let myMap = new Map().set(true, 7).set({foo: 3}, ['abc']);
    mapToArrayJson(myMap)
    // '[[true,7],[{"foo":3},["abc"]]]'

    JSON 转为 Map:正常情况下,所有键名都是字符串。有一种特殊情况,整个 JSON 就是一个数组,且每个数组成员本身,又是一个有两个成员的数组。这时,它可以一一对应地转为 Map。这往往是 Map 转为数组 JSON 的逆操作。

    function jsonToStrMap(jsonStr) {
      return objToStrMap(JSON.parse(jsonStr));
    }
    
    jsonToStrMap('{"yes": true, "no": false}')
    // Map {'yes' => true, 'no' => false}
    
    
    function jsonToMap(jsonStr) {
      return new Map(JSON.parse(jsonStr));
    }
    
    jsonToMap('[[true,7],[{"foo":3},["abc"]]]')
    // Map {true => 7, Object {foo: 3} => ['abc']}
  • 相关阅读:
    Android 3D滑动菜单完全解析,实现推拉门式的立体特效
    2013年9月25日参加耐特菲姆(北京)玉米滴灌培训小结
    日积月累:ProguardGui进行jar包代码混淆
    CSS3之渐变Gradient
    poj 3182 The Grove
    qrcodeJS生成二维码
    样式优先级
    git流程及操作
    js data日期初始化的5种方法 [转]
    转 jQuery中的$.extend方法来扩展JSON对象
  • 原文地址:https://www.cnblogs.com/adhehe/p/9669224.html
Copyright © 2011-2022 走看看