Map结构是一个键值对的集合，跟Object对象不同的是，Map结构的键名(key)可以是任何类型的值;其中Map结构还多了clear方法，size属性和一些用于遍历的方法：keys、values、entries、forEach

Map的基本用法

  • Map结构提供了一个构造函数给我们，我们使用的时候需要用new来创建实例

    1. let m = new Map();

  • 如果想要在创建实例的同时，初始化它的内容，我们可以给它传参，形式跟Set结构类型，都是需要用数组作为参数 ```javascript let m = new Map([ [“name”,”name”], [“gender”,1] ]);

console.log(m); //打印结果：Map {“name” => “name”, “gender” => 1}

  2. - 注意Map( )方法里面的参数，首先它是一个数组，而里面的内容也是由多个数组组成，“name”：“name”作为一个键值对，将它们装在一个数组里面，[“name”：“name”],另外一组键值对也一样：[“gender”：1 ]。这就是初始化一个Map结构实例的基本写法。
  3. <a name="xvmPA"></a>
  4. ### Map结构提供了一些实例的属性和方法
  5. <a name="g4rcs"></a>
  6. #### set( )方法 添加一对键值对
  8. - set( )方法作用：给实例添加一对键值对，返回map实例。
  9. - set(key,value)
  10. ```javascript
  11. let m = new Map();
  12. //set方法添加
  14. //添加一个string类型的键名
  15. m.set("name","job");
  17. //添加一个数字类型的键名
  18. m.set(1,2);
  20. console.log(m);
  21. //打印结果：Map {"name" => "job", 1 => 2}

  • set方法的使用很简单，只需要给方法传入key和value作为键名和键值即可。注意：第三行代码中，我们传入的key是数字1，这就证明了，Map结构确实可以存储非字符串类型的键名，当然你还可以设置更多其它类型的键名

    1. //数组类型的键名
    2. let map = new Map()
    3. let arr = ['123']
    4. map.set(arr,456 )
    6. m.set([1],2);
    8. //对象类型的键名
    9. m.set({"name":"Zhangsan"},2);
    11. //布尔类型的键名
    12. m.set(true,2);
    14. //Symbol类型的键名
    15. m.set(Symbol('name'),2);
    17. //null为键名
    18. m.set(null,2);
    20. //undefined为键名
    21. m.set(undefined,2);

  • 以上6种类型值都可以作为键名，可以成功添加键值对

    使用set方法的时候需要注意，如果设置一个已经存在的键名，那么后面的键值会覆盖前面的键值

  1. let m = new Map();
  2. m.set("name","hello");
  3. console.log(m);
  4. //结果：Map {"name" => "hello"}
  6. //再次设置name的值
  7. m.set("name","world");
  8. console.log(m);
  9. //结果：Map {"name" => "world"}

  • 上面的案例，我们第一次把name的值设置为“hello”，当再次使用set方法设置name的值的时候，后者成功覆盖了前者的值，从此“hello” 变 “world”。

    get( )方法 获取指定键名的键值，返回键值

  • get( )方法作用：获取指定键名的键值，返回键值 ```javascript let m = new Map([[“name”,”王磊”]]);

m.get(“name”);//结果：王磊 m.get(“gender”);//结果：undefined

  2. - get方法使用也很简单，只需要指定键名即可。获取存在对应的键值，如果键值对存在，就会返回键值；否则，返回undefined
  3. <a name="d1puO"></a>
  4. #### delete( )方法 删除指定的键值对
  6. - delete( )方法作用：删除指定的键值对，删除成功返回：true，否则返回：false
  7. ```javascript
  8. let m = new Map();
  10. m.set("name","王磊");
  11. //结果：Map {"name" => "王磊"}
  13. m.delete("name");//结果：true
  14. m.delete("gender");//结果：false

clear()方法 清空所有键值对

  • Map结构提供了clear( )方法，让你一次性删除所有键值对 ```javascript let m = new Map(); m.set(“name”,”name”); m.set(“gender”,1);

m.clear(); console.log(m); //打印结果：Map { }

  1. <a name="HDHLO"></a>
  2. #### has( )方法 判断Map实例内是否含有指定的键值对
  4. - has( )方法作用：判断Map实例内是否含有指定的键值对，有就返回：true，否则返回：false
  5. ```javascript
  6. let m = new Map();
  7. m.set("name","job");
  9. m.has('name');//结果:true
  10. m.has('age');//结果:false

size属性 获取实例的成员数

  • 其中一个常用的属性就是size：获取实例的成员数。 ```javascript let m = new Map(); m.set(1,3); m.set(‘1’,’3’);

m.size;//结果：2

  1. <a name="YIURD"></a>
  2. ### 遍历取值
  3. <a name="a9noH"></a>
  4. #### keys( )方法 获取所有的键名
  6. - keys( )方法：返回实例所有键名的遍历器。
  7. - 既然都是遍历器，那就用for…of把它们遍历出来吧
  8. ```javascript
  9. let m = new Map([
  10.      ["name","job"],
  11.      ["age",25]
  12.  ]);
  14.  //使用keys方法获取键名
  15.  for(let key of m.keys()){
  16.      console.log(key);
  17.  }
  18.  //打印结果：name
  19.  //         age
  21. /* 将键名处理成数组 */
  22. let keysList = Array.from(m.keys());
  23. console.log(keysList);//["name","age"]

values( ) 方法 获取所有的键值

  • values( ) 方法：返回实例所有键值的遍历器。 ```javascript let m = new Map([ [“name”,”job”], [“age”,25] ]);

//使用values方法获取键值 for(let value of m.values()){ console.log(value); } //打印结果：job // 25

/ 将键值处理成数组 / let valuesList = Array.from(m.values()); console.log(keysList);//[“job”,25]

  1. <a name="ShNNt"></a>
  2. #### forEach( )方法
  3. ```javascript
  4. let m = new Map([
  5.     ["name","job"],
  6.     ["age",25]
  7. ]);
  9. m.forEach((value,key) => {
  10.     console.log(key+':'+value);
  11. });
  12. //打印结果：name:job
  13. //         age:25

entries( )方法

  • entries( )方法作用：返回实例的键值对遍历器。 ```javascript let m = new Map([
    1.   ["name","job"],
    2.   ["age",25]
    ]);

for(let [key,value] of m.entries()){ console.log(key+’ ‘+value); } //打印结果：name job // age 25 ```