ES6，新增数据结构Set的用法

ES6 提供了新的数据结构 Set。

特性

似于数组，但它的一大特性就是所有元素都是唯一的，没有重复。

我们可以利用这一唯一特性进行数组的去重工作。

单一数组的去重。

let set6 = new Set([1, 2, 2, 3, 4, 3, 5])
console.log('distinct 1:', set6)

结果：

distinct 1: Set { 1, 2, 3, 4, 5 }

多数组的合并去重

let arr1 = [1, 2, 3, 4]
let arr2 = [2, 3, 4, 5, 6]
let set7 = new Set([...arr1, ...arr2])
console.log('distinct 2:', set7)

结果：

distinct 2: Set { 1, 2, 3, 4, 5, 6 }

操作

1.向Set中添加元素。

let set1 = new Set()
set1.add(1)
set1.add(2)
set1.add(3)
console.log('added:', set1)

结果：

added: Set { 1, 2, 3 }

2.从Set中删除元素。

let set1 = new Set()
set1.add(1)
set1.add(2)
set1.add(3)
set1.delete(1)
console.log('deleted:', set1)

结果：

deleted: Set { 2, 3 }

3.判断某元素是否存在。

let set1 = new Set()
set1.add(1)
set1.add(2)
set1.add(3)
set1.delete(1)
console.log('has(1):', set1.has(1))
console.log('has(2):', set1.has(2))

结果：

has(1): false
has(2): true

4.清除所有元素。

let set1 = new Set()
set1.add(1)
set1.add(2)
set1.add(3)
set1.clear()
console.log('cleared:', set1)

结果：

cleared: Set {}

Set和Array互转

1.数组转Set

let set2 = new Set([4,5,6])
console.log('array to set 1:', set2)let set3 = new Set(new Array(7, 8, 9))
console.log('array to set 2:', set3)

结果：

array to set 2: Set { 4, 5, 6 }
array to set 3: Set { 7, 8, 9 }

2.Set转数组

let set4 = new Set([4, 5, 6])
console.log('set to array 1:', [...set4])
console.log('set to array 2:', Array.from(set4))

结果：

set to array 1: [ 4, 5, 6 ]
set to array 2: [ 4, 5, 6 ]

遍历

可以使用Set实例对象的keys()，values()，entries()方法进行遍历。

由于Set的键名和键值是同一个值，它的每一个元素的key和value是相同的，所有keys()和values()的返回值是相同的，entries()返回的元素中的key和value是相同的。

let set5 = new Set([4, 5, 'hello'])
console.log('iterate useing Set.keys()')
for(let item of set5.keys()) {console.log(item)
}console.log('iterate useing Set.values()')
for(let item of set5.values()) {console.log(item)
}console.log('iterate useing Set.entries()')
for(let item of set5.entries()) {console.log(item)
}

结果：

iterate useing Set.keys()
4
5
helloiterate useing Set.values()
4
5
helloiterate useing Set.entries()
[ 4, 4 ]
[ 5, 5 ]
[ 'hello', 'hello' ]

其他特性

在向Set加入值时，Set不会转换数据类型，内部在判断元素是否存在时用的类似于精确等于(===)的方法，“2”和2是不同的，NaN等于其自身。

let set8 = new Set()
set8.add(NaN)
set8.add(NaN)
console.log('NaN===Nan is true:', set8)

结果：

NaN===Nan is true: Set { NaN }

End

转载于:https://www.cnblogs.com/kongxianghai/p/7250248.html

ES6，新增数据结构Set的用法相关推荐

重温ES6核心概念和基本用法
ES6在2015年6月就得以批准,至今已两年了.近一年多以来陆续看过很多ES6的资料,工作项目中也逐步的用上了很多ES6的特性(let,const,promise,Template strings,C ...
第十六节：ES6新增的 Set 和 WeakSet 是什么东西？
题外话:往后的章节,跟前面的章节联系越来越紧密,很多知识的讲解建立在前面章节的学习基础上,如果是新来的同学,建议从第一节学起.如果是忘记了前面的内容,前端君也会在适当的时候,加上跳转链接. 什么是Se ...
JS的ES5和ES6新增的方法(重点)
ES5 EcmaScript5 严格模式和高阶函数严格模式 1.全局严格函数外的是全局 2.局部严格函数内部的是局部使用严格模式 "use strict" 必须放在代码的第 ...
ES6新增语法与内置对象扩展
技术交流QQ群:1027579432,欢迎你的加入! 欢迎关注我的微信公众号:CurryCoder的程序人生 1.什么是ES6 ES的全称是ECMAScript,它是由ECMA国际标准化组织制定的一项 ...
【ES6】JS类的用法class
[ES6]JS类的用法class 一.概述二.构造函数constructor 三.静态方法与静态变量查看更多ES6教学文章: 参考文献引言:由于JS之前一直没有特有的class来定义类的语法,E ...
ES6 let与const基础用法笔记
ES2015(ES6)新增了两个JS关键字:let和const.主要是用来变量的声明. 2.let 用法示例 { let score=100; alert(score); } let 特性代码块内有 ...
H5新增、CSS3以及ES5、ES6新增特性
1.H5新增新增特性:语义化标签.音视频处理API.canvas.拖拽释放API.history API.地理位置API.webSocket.web存储的localStorage和SessionSt ...
谈谈ES6新增了哪些特性
一.什么是ES6? ES全称为ECMAScript,它是由国际标准化组织ECMA(全称:European Computer Manufacturers Association)欧洲计算机制造商协会制定 ...
ES6新增数据类型：Symbol
[学习es6新增的数据类型 Symbol] 1.symble 的作用 symbol 是 es6 新增的一个基本的数据类型,定义唯一值的:一般用于给对象添加私有属性. 2.symble 的用法 < ...

ES6，新增数据结构Set的用法

ES6，新增数据结构Set的用法相关推荐

最新文章

热门文章