0
点赞
收藏
分享

微信扫一扫

ES6数据结构Set

ES6中引入新的数据结构Set非常强大,直接切入正题!

我们从三个方便来聊下Set:

   Set基本用法

   Set的属性

   Set方法

————————————————————————————————————————————————

1、Set基本用法:

Set数据结构类似于数组,但是里边的成员都是唯一的(也就是说如果用set存储数据,你不用担心数据是否有重复的),没有重复值。

 <1>  set本身是一个构造函数,用来生成Set数据结构:

let set = new Set();
console.log(set.constructor) //ƒ Set() { [native code] }

<2>  先来证明下里边的成员不会重复:下边我们用add()方法向Set结构中添加数据,结果无重复。

let set = new Set();

//向Set中添加数据
[1,2,2,3].forEach(item=>set.add(item));

//遍历Set里每一个数据
for(let i of set){
console.log(i)//1 2 3
}

补充:

Set去重:

// 知识点:Array.from 会把Set结构 转化为数组
let arr = [1,2,3,1,1,2]
function qc(arr) {
return Array.from(new Set(arr))
}
let r = qc(arr) // [1,2,3]

<3>  Set数据结构可以接收的参数

它可以接受一个数组或带有Iterator接口的其它数据结构作为参数,用来初始化,这里着重强调下,用add( ) 方法可以添加任意值,但初始化时参数只能是数组 或 带有Iterator接口的数据。。。

let set = new Set([1,2,1,3])
console.log([...set]) //[1,2,3]

let set = new Set([1,2,3,3])
console.log(set.size) //3 相当于xxx.length()

<4>  用于字符串去重

let set = new Set("hello")
//字符串去重,然后解构赋值成一个数组,然后在转化为字符串
console.log( [...set].join("") ) // helo

注意点 : 向上set中加入值得时候,不会发生类型转换,所以“1”和1两个是不同的值。( 还有特殊的NaN与NaN是相等的 )

let set = new Set();
set.add({})
set.size //1

set.add({})
set.size //2

 

2、Set属性和方法:

Set结构的实例有以下属性 : 

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

—— Set.prototype.size : 返回Set实例的成员总数(与length差不多)

Set结构的实例方法分为两大类,操作方法和遍历方法 :

   < 1 > 操作方法:

 —— Set.prototype.add(value) : 添加某个值,返回Set结构本身,也就是说add()方法可以链式调用;

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

—— Set.prototype.has(value) : 返回一个布尔值,判断该值是否为Set的成员;

—— Set.prototype.clear(value) : 清除所有成员,没有返回值。

let set = new Set();
set.add(1).add(1).add(2); //添加数据
set.size //2 Set中的成员总数
set.delete(1) //删除Set成员中的1
set.size() //1
set.has(1) // false 是否有1

   < 2 > 操作方法:数组去重:Array.from()可将set结构转化为数组

let set = new Set([1,2,1])
console.log(Array.from(set))//[1,2]

   < 3 > 遍历操作:

Set结构的实例有四个遍历方法,可用于遍历成员:

—— Set.prototype.keys() : 返回键名的遍历器;

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

—— Set.prototype.values() : 返回键值的遍历器;(因为Set数据结构里边的成员没有键名,只有键值,所以keys()和values()方法完行为全一致。。。)

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

—— Set.prototype.entries() : 返回键值对的遍历器;

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

—— Set.prototype.forEach() : Set结构的实例与数组一样,也有forEach方法,用于对每个成员执行某一操作,没有返回值;

let set = new Set([1,2,3])
set.forEach((key,value)=>{
console.log(key +":"+ value)
//1:1
//2:2
//3:3
})

Set中键值都一样,所以返回的两个参数都相同。。。

   < 4 > 遍历操作的应用:

扩展运算符(. . .)内部使用了for...of循环,所以也可以用于Set结构。。。

使用扩展运算符可把Set转为去重后的数组

let set = new Set([1,2,3])
console.log([...set])//[1,2,3]

 < 5 > 实际操作中,如果想在遍历中,你无法同步改变原有的Set数据结构,只能返回一个新结构,然后赋值给原有的Set结构:

下边代码:在原有的Set结构中成员乘2,返回一个新Set结构

let set = new Set([1,2,3]);
let newSet = new Set([...set].map(items=>items*2))
console.log(newSet) //set数据结构:{1,2,3}

下边代码:在原有Set结构中,返回一个由偶数成员组成的新的Set结构

let set = new Set([1,2,3,4]);
let newSet = new Set([...set].filter((items)=>items % 2 === 0))
console.log(newSet)//set数据结构:{2,4}

总结:以上就是Set数据结构的用法,想要对sey有一个深刻认识,还需要在实际开发中应用。


举报

相关推荐

0 条评论