es6_Set数据类型概括

set(集合)数据类型为Es6新增的数据类型(是引用数据类型)；

作用

存储一组数据(和数组非常相似，区别是无法存储重复的元素(精确相等===))

语法

• [1]创建set数据

  • let s=new Set([arr])；
    

  • arr参数为可选择的–>数据类型为数组\字符串(否则会报错)

  • console.log('111',new Set(111)) // error number 111 is not iterable
    

• [2]add()方法向 Set 结构加入成员

  • s.add(value)
    

  • 一次只能添加一个值–>添加多个参数仅会添加一个值；

  • 返回值为该set结构；

• [3]delete()方法删除Set结构的某个值

  • s.delete(value)
    

  • 返回一个布尔值，表示删除是否成功

• [4]has()方法判断Set结构中是否有该元素

  • s.has(value)
    

  • 返回一个布尔值，表示该值是否为Set的成员

• [5]size属性用于返回set结构中元素的数量

  • s.size
    

• [6]clear()方法用于清除该set的所有成员；

  • s.clear()
    

• 举例说明

  • set在比较过程中，简单数据类型比较全等；引用数据类型比较的是数据的地址引用

  • const set = new Set([[111]])
    console.log('111111', set.has([111])) // false
    

    • 引用地址不同，找不到相同数据

  • const arr = [111]
    const set = new Set([arr])
    console.log('111111', set.has(arr)) // true
    

    • 引用地址相同，认为是同一数据

  • const num = NaN
    const set = new Set([num])
    console.log('111111', set.has(num)) // true
    
    const set = new Set([NaN])
    console.log('111111', set.has(NaN)) // true
    

    • 在 Set中， 会将NaN比较为相等的；

set数据遍历

(1)Set 结构的实例有四个遍历方法，可以用于遍历成员。

[1]遍历方法

• Set.prototype.keys()：返回键名的遍历器
• Set.prototype.values()：返回键值的遍历器
• Set.prototype.entries()：返回键值对的遍历器
• Set.prototype.forEach()：使用回调函数遍历每个成员

[2]举例说明

• const arr = [1,2,3,3,2,1,'a','b','c','c','b','a']
  const s = new Set(arr)
  console.log('s',s.keys())
  

  • 

  • 就个人而言，觉得 keys、values、entries遍历方法作用不大，因为获取的还是遍历器，还是需要遍历 遍历器才能获取数据！

  • const arr = [1,2,3,3,2,1,'a','b','c','c','b','a']
    const s = new Set(arr)
    for(const item of s.keys()){
      console.log('item', item)
    }
    

  • 

• const arr = [1,2,3,3,2,1,'a','b','c','c','b','a']
  const s = new Set(arr)
  s.forEach(item=>{
    console.log('item', item)
  })
  

  • 

  • 还是forEach遍历set更方便一些；

(2)遍历的应用

• for of遍历应用

应用

[1]数组去重

const arr = [1,2,3,3,2,1,'a','b','c','c','b','a']
const s = new Set(arr) // 存储的是传入数组中不重复的数据

将set数据转化为数组

• (1)使用Array.from方法

  • const arr = [1,2,3,3,2,1,'a','b','c','c','b','a']
    const s = new Set(arr) 
    const newArr = Array.from(s)
    console.log('newArr', newArr) // [1, 2, 3, 'a', 'b', 'c']
    

• (2)使用for of遍历

  • const arr = [1,2,3,3,2,1,'a','b','c','c','b','a']
    const s = new Set(arr) // 存储的是传入数组中不重复的数据
    const newArr = []
    for(const item of s){
      newArr.push(item)
    }
    console.log('newArr', newArr) // [1, 2, 3, 'a', 'b', 'c'] 
    

• (3)使用展开运算符

  • 展开运算符是es6新增的遍历方法，内部其实是使用 for of进行封装的；

  • const arr = [1,2,3,3,2,1,'a','b','c','c','b','a']
    const s = new Set(arr) // 存储的是传入数组中不重复的数据
    const newArr = [...s]
    console.log('newArr', newArr) // [1, 2, 3, 'a', 'b', 'c'] 
    

[2]取数组并集

const arr1 = [1,2,3,3,2,1,'c','b','a']
const arr2 = [1,2,4,6,8,9]
const s = new Set([...arr1,...arr2]) // 存储的是传入数组中不重复的数据
const newArr = [...s]
console.log('newArr', newArr) // [1, 2, 3, 'c', 'b', 'a', 4, 6, 8, 9]

[3]取数组交集

const arr1 = [1,2,3,3,2,1,'c','b','a']
const arr2 = [1,2,1,4,6,8,9]
const s1 = new Set(arr1) 
const s2 = new Set(arr2)
const arr = [...s1].filter(item => s2.has(item))
console.log('newArr', arr) // [1, 2]

[4]去重字符串中的重复字符；

const str = 'hello word'
const newStr = [...new Set(str)].join('')
console.log('newStr', newStr) // newStr helo wrd