ES6 新增Set与Map

前言

• 上篇了解了ES6新增函数
• 这篇讲讲新增 Set Map 两种数据结构

Set

• Set是集合的数据结构

  • 由一堆无序，相关联，不重复的元素组成的组合
  • 类似数组 所有元素的值是唯一的
  • Set本身就是构造函数 用来生成Set数据结构

  let a = new Set()
  

  • Set的增删改查方法
  • add 添加某个值 返回Set本身

  let a = new Set()
  a.add(1).add(1) // 1只被添加了一次 set不允许有重复元素
  

  • delete 删除某个元素 返回一个布尔值

  let a = new Set()
  a.add(1).add(2) // {1,2}
  a.delete(1) // true
  a // {2}
  

  • has 判断元素是否存在set中 返回一个布尔值

  let a = new Set()
  a.add(1) // {1}
  a.has(1) // true
  

  • clear 清除所有元素 没有返回值

  let a = new Set()
  a.add(1).add(3) // {1,3}
  a.clear()
  a // {}
  

• Set 遍历方法

  • keys 返回键名的遍历器

  let a = new Set([1,2,3])
  for(let item of a.keys()) {
      console.log(item) // 1 2 3
  }
  

  • values 返回键值的遍历器

  let a = new Set([1,2,3])
  for(let item of a.values()) {
      console.log(item) // 1 2 3
  }
  

  • entries 返回键值对的遍历器

  let a = new Set([1,2,3])
  for(let item of a.entries()) {
      console.log(item) // [1,1] [2,2] [3,3]
  }
  

  • forEach 使用回调函数遍历每个元素

  let a = new Set([1,2,3])
  a.forEach((value,key)=>{console.log(`${key}:${value}`)})
  // 1:1 2:2 3:3
  

  • 扩展运算符和set并用实现数组去重

  let arr =  [1,2,3,3,2,1]
  let arr2 = [...new Set(arr)] // [1,2,3]
  

Map

• 键值对的有序列表 键和值可以是任何类型

  • map 本身是构造函数 用来生成map结构

  let map = new Map()
  

• map的增删改查

  • size 返回map结构中元素个数

  let map = new Map()
  map.set(1,2)
  map.size // 1
  

  • set 设置键名与键值 并返回map 如果键名相同 键值则会覆盖

  let map = new Map()
  map.set(1,2).set(3,4) //链式写法
  

  • get 读取key对应的值 如果找不到key 返回undefined

  let map = new Map()
  map.set(1,2).set(3,4) // {1=>2,3=>4}
  map.get(1) // 2
  

  • has 查找某个键是否在当前map中 返回布尔值

  let map = new Map()
  map.set(1,2) // {1=>2}
  map.has(1) //true
  

  • delete 删除某个键 返回一个布尔值

  let map = new Map()
  map.set(1,2).set(3,4) // {1=>2,3=>4}
  map.delete(1) //true
  map // {3=>4}
  

  • clear 清除所有元素 没有返回值

  let map = new Map()
  map.set(1,2).set(3,4) // {1=>2,3=>4}
  map.clear
  map // {}
  

• Map的遍历

  • keys 返回键名的遍历器

  let map = new Map([
      ['a',1],
      ['b',2]
  ])
  for(let item of map.keys()) {
      console.log(item)  // 'a' 'b'
  }
  

  • values 返回键值的遍历器

  let map = new Map([
      ['a',1],
      ['b',2]
  ])
  for(let item of map.values()) {
      console.log(item)  // 1 2
  }
  

  • entries 返回键值对的遍历器

  let map = new Map([
      ['a',1],
      ['b',2]
  ])
  for(let item of map.entries()) {
      console.log(item)  // ['a',1] ['b',1]
  }
  

  • forEach 遍历map所有元素

  let map = new Map([
      ['a',1],
      ['b',2]
  ])
  map.forEach((value,key)=>{
      console.log(key,value)
  })
  // a 1 b 2
  

Set与Map的区别

• 共同点
  • 集合、字典都可以存储不重复的值
• 不同点
  • 集合是以[值，值]的形式存储元素，字典是以[键，值]的形式存储

结语

• 今日份小知识get~