ES6中的Map和Set

ES6中的Map和Set

1、Map

Map对象以键值对的形式存储,它的键和值可以是任何类型

  • Map的创建
  // 创建一个空Map
  let map  = new Map();
  //用一个二维数组来创建一个非空Map
  let map2 = new Map([
      ["name","李四"],
      ["age",12],
      [{},123],
      [12,8]
  ]);
  console.log(map2);//Map(4) {'name' => '李四', 'age' => 12, {…} => 123, 12 => 8}

  

  • Map的属性和操作方法

1. set(key,value): 增加一个新元素,返回当前Map

2. get(key): 读取key对应的键值,如果找不到key,返回undefined

3. has(key):检测Map中是否包含某个元素,返回Boolean值

4. delete(key): 删除某个元素,成功则返回 true, 若key不存在或者删除失败会返回 false

5. clear():清空Map集合,返回undefined

6. size属性返回Map的元素个数

  let map  = new Map();
  //set方法可以同时添加多个元素(链式写法)
  map.set(0,"zero")
      .set(1,"one")
      .set("first","all");
  console.log(map);//Map(3) {0 => 'zero', 1 => 'one', 'first' => 'all'}
  
  // 给同一个键名多次赋值,后面的值将覆盖前面的值。
  map.set("one","张三")
      .set("two","李四")
      .set("two","王五")
      .set("change",function(){});
  console.log(map);//Map(3) {'one' => '张三', 'two' => '王五', 'change' => ƒ}
  
  //get方法
  console.log(map.get("change"));//ƒ (){}
  console.log(map.get("three"));//undefined
  
  //has方法
  console.log(map.has("one"));//true
  console.log(map.has(11));//false
  
  //delete
  console.log(map.delete("one"));//true
  console.log(map.delete("ooo"));//false
  
  //clear
  console.log(map.clear());//undefined
  
  //size属性
  console.log(map.size);//3
  • Map的遍历方法
  1. keys():返回键名的遍历器。

  2. values():返回键值的遍历器

  3. entries():返回所有成员的遍历器

  4. forEach():遍历 Map 的所有成员

  //遍历键名
  for (let key of map.keys()) {
      console.log(key);//one two change
  }
  //遍历键值
  for (let value of map.values()) {
      console.log(value);//张三 王五 ƒ (){}
  }
  //遍历所有成员
  for (let [key,value] of map.entries()) {
      console.log(key,value);//one 张三 two 王五 change ƒ (){}
  }
  //遍历所有成员
  for (let [key,value] of map) {
      console.log(key,value);//one 张三 two 王五 change ƒ (){}
  }
  //forEach
  map.forEach((value,key)=>{
      console.log(key,value);//one 张三 two 王五 change ƒ (){}
  })

2、Set

Set集合 类似于数组,但所有的成员都是唯一的

  • Set创建
  //创建空Set
  let set = new Set();
  //创建非空Set
  //和 Map 不同的是, 数组是一维数组, 每个元素都会成为 set 的值
  let set2 = new Set(["one","two","three","four","five"]);
  console.log(set2);//Set(5) {'one', 'two', 'three', 'four', 'five'}
  • Set实例的操作方法

1.constructor:构造函数,默认就是Set函数

2.size:返回Set实例的成员总数

3.add(value):添加某个值,返回 Set 结构本身

4.delete(value):删除某个值,返回一个布尔值,表示删除是否成功

5.has(value):返回一个布尔值,表示该值是否为Set的成员

6.clear():清除所有成员

  let set = new Set();
  //add
  set.add("one")
      .add("two");
  console.log(set);//Set(2) {'one', 'two'}
  //往set添加一个元素, 同时传入多个参数, 只会把第一个加入进去
  set.add(1, 2, 3);
  console.log(set);//Set(1) {1}
  
  //delete
  console.log(set.delete('one'));//true
  
  //has
  console.log(set.has('one'));//false
  console.log(set.has('two'));//true
  
  //clear
  console.log(set.clear());//undefined
  console.log(set);//Set(0) {size: 0}
  • Set的遍历方法

1.keys():返回键名的遍历器

2.values():返回键值的遍历器

3.entries():返回键值对的遍历器

4.forEach():使用回调函数遍历每个成

  Set 的遍历顺序就是插入顺序,Set 结构没有键名,只有键值(或者说键名和键值是同一个值),所以 keys 方法和 values 方法的行为完全一致。

  Set的遍历方法的使用方法和Map的方法相似

  • 数组去重
  //数组去重
  //1、使用扩展运算符【...】
  let set = new Set([1,2,3,5,4,3,2,1,0]);
  console.log([...set]);//[1, 2, 3, 5, 4, 0]
  //2、Array.from()
  let result = Array.from(set);
  console.log(result);//[1, 2, 3, 5, 4, 0]
  • 并集(Union)、交集(Intersect)和差集(Difference)
  let a = new Set([1,2,3]);
  let b = new Set([4,3,2]);
  //并集
  let union = new Set([...a,...b]);
  console.log(union);//Set(4) {1, 2, 3, 4}
  
  //交集
  let intersect = new Set([...a].filter(x => b.has(x)));
  console.log(intersect);//Set(2) {2, 3}
  
  //(a 相当于 b的)差集
  let difference = new Set([...a].filter(x => !b.has(x)));
  console.log(difference);//Set(1) {1}

 注意 :这两种集合都是有序的, 元素被添加进去的顺序就是在内部保存的顺序. 对于用数组来初始化的集合也一样, 按照在数组中的位置依次添加进集合中.

猜你喜欢

转载自blog.csdn.net/weixin_45990765/article/details/120787546