ES6中的Set 数据类型

本文介绍了ES6中新增的Set数据类型,包括其实例化方式、常用方法如添加元素、获取元素数量、删除元素、判断成员存在、清空集合以及转换为数组。通过实例演示了Set如何实现去重和遍历,并展示了Set与数组的区别。
摘要由CSDN通过智能技术生成

 -Map 和 Set 是 ES6 新增的两个数据类型
- 都是属于内置构造函数
- 使用 new 的方式来实例化使用

Set数据类型

语法:

var s2 = new Set([1, 2, 3])

常用的方法:

1.add 往set集合中最后增加一个元素
    语法:xxx.add( )

<script type="text/javascript">
	    let s = new Set(['李雷', '韩梅梅', true, 123])//里面可以传入任意格式的元素
	    let s2 = new Set('set2')
	    console.log(s2);//打印的结果是Set(4) {"s", "e", "t", "2"}
	    
	
	    //add 往set集合中最后增加一个元素
	    // 复杂数据类型,添加的时候,用变量进行引用,删除的时候,再把变量传递进去就可以删除了
	    let o = { name: '王五' };//声明一个对象
	    let fn = function () { }//声明一个函数
	    
	
	    s.add(o)//往s中添加这个对象o
	    s.add(fn)//往s中添加这个函数fn
	    s.add(998)//往s中添加这个数字998
	    s.add(s2)//往s中添加这个
	    console.log(s);//打印的结果中,所添加的元素都被加上去了Set(8) {"李雷", "韩梅梅", true, 123, {…}, …}
</script>

2. `size`  : 用来获取该数据结构中有多少数据的 

<script type="text/javascript">
	  const s = new Set([1, 2, 3, {}, function () {}, true, 'hwllo'])
	  
	  console.log(s.size) // 7 说明里面有七条数据
</script>

3. delete(要删除的值) 删除Set中的元素,返回值是一个布尔值,如果删除成功那么返回true,如果删除失败,那么就返回false
语法:xxx.delete( )

<script type="text/javascript">

    //delete(要删除的值) 删除Set中的元素,返回值是一个布尔值,如果删除成功那么返回true,如果删除失败,那么就返回false
    let s = new Set(['李雷', '韩梅梅', true, 123])//里面可以传入任意格式的元素

    s.delete('李雷') //在Set集合中删除了李雷这一项
    s.delete(true) // 删除了集合中true这个元素
    s.delete('韩梅梅')//删除了集合中韩梅梅这个元素

    //复杂数据类型,添加的时候,用变量进行引用,删除的时候,再把变量传递进去就可以删除了
	
	let o = { name: '王五' };//声明一个对象
	let fn = function () { }//声明一个函数
	s.add(o)//往s中添加这个对象o
	s.add(fn)//往s中添加这个函数fn
    s.delete(o)
    s.delete(fn)
    console.log(s);//此时打印的结果仅为123
</script>

4. has 判断集合中是否有某个元素
语法:xxx.has( )

<script type="text/javascript">
    //has 判断聚合中是否包含传入的元素
    let s = new Set(['李雷', '韩梅梅', true, 123])//里面可以传入任意格式的元素
    let o = { name: '王五' };//声明一个对象
    s.add(o)//往s中添加这个对象o
    console.log(s.has(123));//true集合中有123这个元素
    console.log(s.has(0));//false,集合中没有0这个元素
    console.log(s.has(o));//true,集合中有o这个对象
</script>

5.clear 清空集合中所有的元素
语法:xxx.clear( )

<script type="text/javascript">
    //clear 清空集合中所有的元素
    let s = new Set(['李雷', '韩梅梅', true, 123])//里面可以传入任意格式的元素
    let o = { name: '王五' };//声明一个对象
    s.add(o)//往s中添加这个对象o
    s.clear()
    console.log(s);//Set(0) {}  打印的集合中里面的所有元素都被清空了
</script>

6. forEach 用于遍历Set集合中的元素,Set集合的索引就是值本身
语法:xxx.forEach((item)=>{console.log(item);})

<script type="text/javascript">
    //forEach 用于遍历Set集合中的元素,Set集合的索引就是值本身
    let s = new Set(['李雷', '韩梅梅', true, 123])//里面可以传入任意格式的元素
    let o = { name: '王五' };//声明一个对象
    s.add(o)//往s中添加这个对象o
    s.forEach((item, index, Set) => {
        console.log(item);//Set中的每个元素
        console.log(index);//index和Set的元素值是一样的
        console.log(Set); //Set集合本身
    })
    //所以在遍历set的时候,只需要s.forEach((item)=>{console.log(item);})

</script>

7.Set中的元素是不允许出现重复的数据的

   所以set可用于数组去重

<script type="text/javascript">
    let set2 = new Set([1, 1, 2, 2, 3, 3, 4, 4, 5, 5, 6, 6])
    console.log(set2);//打印的结果为Set(6) {1, 2, 3, 4, 5, 6}
</script>

8.将`Set`转换成数组的方法 

 a. Array.from()

b.展开运算符

<script type="text/javascript">
	                    //Array.from(set)
	let set2 = new Set([1, 1, 2, 2, 3, 3, 4, 4, 5, 5, 6, 6])
	console.log(set2); //Set是不允许出现重复的数据的打印结果为Set(6) {1, 2, 3, 4, 5, 6}
	// //转换成数组来使用
	console.log(Array.from(set2)); // [1, 2, 3, 4, 5, 6]


	                   //ES6中的展开运算符
	let set3 = new Set([1, 1, 2, 2, 3, 3, 4, 4, 5, 5, 6, 6])
	console.log(set3); //Set是不允许出现重复的数据的打印结果为Set(6) {1, 2, 3, 4, 5, 6}
	console.log([...set3]); // [1, 2, 3, 4, 5, 6]
</script>

 

 

 

 

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值