详解ES6中的 Set Map 数据结构学习总结

来源：懂视网责编：小采时间：2020-11-27 22:04:19

详解ES6中的 Set Map 数据结构学习总结

详解ES6中的 Set Map 数据结构学习总结:ES6中的 Set 数据结构 ES6 新增了一种 Set 数据结构。它类似数组。最重要的一点是 Set中的结构成员没有重复的, 可用这点一行代码实现数组去重。 Set 本身是一个构造函数。通过 new Set() 来创建Set结构。 let arr1 = ['Hello', '

推荐度：

点击下载本文 文档为doc格式

导读详解ES6中的 Set Map 数据结构学习总结:ES6中的 Set 数据结构 ES6 新增了一种 Set 数据结构。它类似数组。最重要的一点是 Set中的结构成员没有重复的, 可用这点一行代码实现数组去重。 Set 本身是一个构造函数。通过 new Set() 来创建Set结构。 let arr1 = ['Hello', '

ES6中的 Set 数据结构

ES6 新增了一种 Set 数据结构。它类似数组。最重要的一点是 Set中的结构成员没有重复的, 可用这点一行代码实现数组去重。 Set 本身是一个构造函数。通过 new Set() 来创建Set结构。

 let arr1 = ['Hello', 'World', 'ES6']
 let set1 = new Set() 
 arr1.forEach(type => {
 set1.add(type)
 })

通过new Set创建一个Set结构。 forEach 遍历arr1数组。把每一项通过Set.prototype.add 方法向Set结构中添加成员。

Set 也可以接受一个数组作为参数。

 let arr2 = [1,2,3,4,1,5,2]
 let set2 = new Set(arr2) 
 for (let type of set2) {
 console.log(type)
 }
 // 1
 // 2
 // 3
 // 4
 // 5

上面的new Set() 创建 Set 数据结构时, 将一个数组作为它的参数。最后通过 for of 遍历 set2。因为结构成员没有重复, 所以打印 1 2 3 4 5

Set 接受的参数不会进行类型转换 , new Set(5, '5') 这完全是两个值。

Set 实现数组去重

 // 方法1 
 [...new Set([1,2,3,1,2])] // 1 2 3
 
 // 方法2
 Array.from(new Set([1,2,3,1,2])) // 1 2 3

都是通过向 new Set() 中传入一个数组, 利用 Set结构成员都是唯一的特性, 最后通过扩展运算符..., 或者ES6提供的一种将类数组转换为数组的方法 Array.from()。

Set 操作方法

Set.prototype.add(value) 向Set结构中添加一名成员, 返回值为Set结构

Set.prototype.delete(value) 删除一名成员, 返回值为布尔值。 true成功, false失败

Set.prototype.has(value) Set 成员是否存在, true为存在, false为不存在

Set.prototype.clear() 清空所有的成员

 let arr3 = [7,8,9]
 let set3 = new Set(arr3)
 set3.add(10)
 set3.size() // 4
 set3.delete(8)
 set3.size() // 3
 set3.clear() // 0

Set 遍历方法

keys() 键名的遍历器

values() 键值的遍历器

entries() 键值对的遍历器,以数组形式返回

 let arr4 = ['javascript', 'vue', 'node.js', 'typescript']
 let set4 = new Set(arr4) 
 
 // set.keys()
 for (let k of set4.keys()) {
 console.log(k)\
 // javascript
 // vue 
 // node.js
 // typescript
 } 

 // set.values()
 for (ket v of set4.values()) {
 console.log(v)
 // 和上面的set4.keys() 遍历的结果一样
 } 

 // set.entries()
 for (let e of set3.entries()) {
 console.log(e)
 // ['javascript', 'javascript']
 // ['vue', 'vue']
 // ['node.js', 'node.js']
 // ['typescript', 'typescript']
 }

可见, keys()和values() 遍历是一模一样的, 以后遍历使用keys()还是values()没有区别。entries 遍历返回的是数组, 分别是keys() values()结果。

声明：本网页内容旨在传播知识，若有侵权等问题请及时与本网联系，我们将在第一时间删除处理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

详解ES6中的 Set Map 数据结构学习总结

推荐度：

点击下载本文 文档为doc格式

标签：的数据 se 数据

热门焦点

详解ES6中的 Set Map 数据结构学习总结

详解ES6中的 Set Map 数据结构学习总结

详解ES6中的 Set Map 数据结构学习总结

最新推荐

猜你喜欢

热门推荐