阮大神的es6看了一遍,但是对于Set和Map还是一知半解的,主要还是没怎么用吧,这里总结一下,以后再工作中也要多用用才行

怎么定义set呢?有什么用处?

set是ES6中新增的类型,和数组类似,唯一不同在于该类型不会有重复的数据,一般常用来对数据进行去重操作。

//创建实例
let set = new Set() //{}
let set = new Set([1,2,3]) //{1,2,3} //相关方法
set.has(1) //判断元素是否存在
set.add('1') //添加元素
set.delete(1) //删除元素
set.clear() //清除元素

知道了怎么定义,怎么创建实例,但是set这个数据结构怎么用来去重的?来看一看

//数组去重
let set = new Set([1,2,2,3,3])
console.log(set) //{1,2,3} //多数组合并去重
let arr1 = [1,2,66,5,3]
let arr2 = [1,56,5,4]
let set = new dSet([...arr1,...arr2])
console.log(set) //{1,2,66,5,3,56,4}

想必大家都注意到啦,我们去重后的数据结构不是用[]括起来的数组啊,所以来看一下怎么实现Set和Array之间的转换

说道Array转Set,上面的实例不就是将数组转成了Set嘛

那么Set转Array呢,怎么实现? 其实很简单,有两种方式

//使用拓展运算符
let set = new Set([1,2,3])
console.log([...set]) // [1,2,3] //使用Array.from()
console.log(Array.from(set)) // [1,2,3

Set类型的数据,也可以像数组一样做 循环遍历

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

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

这里引用一位道友的代码  ES6,新增数据结构Set的用法

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

end

ES6之Set的更多相关文章

  1. ES6模块import细节

    写在前面,目前浏览器对ES6的import支持还不是很好,需要用bable转译. ES6引入外部模块分两种情况: 1.导入外部的变量或函数等: import {firstName, lastName, ...

  2. webpack+react+redux+es6开发模式

    一.预备知识 node, npm, react, redux, es6, webpack 二.学习资源 ECMAScript 6入门 React和Redux的连接react-redux Redux 入 ...

  3. ES6的一些常用特性

    由于公司的前端业务全部基于ES6开发,于是给自己开个小灶补补ES6的一些常用特性.原来打算花两天学习ES6的,结果花了3天才勉强过了一遍阮老师的ES6标准入门(水好深,ES6没学好ES7又来了...) ...

  4. ES6(块级作用域)

    我们都知道在javascript里是没有块级作用域的,而ES6添加了块级作用域,块级作用域能带来什么好处呢?为什么会添加这个功能呢?那就得了解ES5没有块级作用域时出现了哪些问题. ES5在没有块级作 ...

  5. es6小白学习笔记(一)

    1.let和const命令 1.es6新增了let和const命令,与var用法类似,但它声明的变量只在let所在的代码块内有效(块级作用域,es5只有全局和函数作用域) { let a = 1; v ...

  6. ES6之变量常量字符串数值

    ECMAScript 6 是 JavaScript 语言的最新一代标准,当前标准已于 2015 年 6 月正式发布,故又称 ECMAScript 2015. ES6对数据类型进行了一些扩展 在js中使 ...

  7. ES6之let命令详解

    let与块级作用域 { var foo='foo'; let bar='bar'; } console.log(foo,'var'); //foo varconsole.log(bar ,'bar') ...

  8. ES6 箭头函数中的 this?你可能想多了(翻译)

    箭头函数=>无疑是ES6中最受关注的一个新特性了,通过它可以简写 function 函数表达式,你也可以在各种提及箭头函数的地方看到这样的观点——“=> 就是一个新的 function”. ...

  9. ES6+ 现在就用系列(二):let 命令

    系列目录 ES6+ 现在就用系列(一):为什么使用ES6+ ES6+ 现在就用系列(二):let 命令 ES6+ 现在就用系列(三):const 命令 ES6+ 现在就用系列(四):箭头函数 => ...

  10. ES6+ 现在就用系列(一):为什么使用ES6+

    系列目录 ES6+ 现在就用系列(一):为什么使用ES6+ ES6+ 现在就用系列(二):let 命令 ES6+ 现在就用系列(三):const 命令 ES6+ 现在就用系列(四):箭头函数 => ...

随机推荐

  1. Chrome插件开发(二)

    作为一个前端开发者,我们经常需要和各种各样的接口打交道,很多时候我们的开发环境的域和接口所在的域是不同的,比如我们本地开发环境运行域是localhost,但接口所在的域是www.xx.com,这个时候 ...

  2. ABAP中时间戳的处理

    UTC(UTC, Universal Time Coordinated,通用协调时)时间戳,分为长时间戳和段时间戳,其中长时间戳餐开始的系统的数据元素TIMESTAMPL,类型为DEC(21,7):而 ...

  3. git .gitignore详解

    1.最近使用git又遇到一个陷阱: 场景:A和B使用的不同的编译器做的同一个解决方案下的不同的项目工程,刚开始没考虑到版本问题,后来发现A上传的csproj在B需要做很麻烦修改才能打开,后来想到各自用 ...

  4. [tesseract-ocr]OCR图像识别Ubuntu下环境包安装

    问题: ImportError: libSM.so.6: cannot open shared object file: No such file or directory 解决: sudo apt- ...

  5. [考试反思]1004csp-s模拟测试59:惊醒

    一句话:我看错考试时间了,我以为11:30结束,T2T3暴力没来得及交. 为什么考试的时间忽然变了啊...没转过来 一定要看清考试的起止时间! 虽说T2T3连爆搜都没打,只打特殊性质只有32分.爆搜分 ...

  6. CSPS模拟 47

    考试时T1没玩明白,用一个WA90把100盖住了? T1 Emotional Flutter 题目非常蠢萌,只是注意当你把黑块前伸s距离后,应把脚的长度视为0,而不应为1. T2 Endless Fa ...

  7. CSPS模拟 44

    状态不是很好吧 这套和前边是一套的, skyh在我旁边AK,好像开了三个对拍又在拼小人 T3 正解没调出来,暴力又忘交了qwq 当时心情都要爆炸了 T1 区间$gcd$乘区间长度的最大值 暴力是$n^ ...

  8. 基于xposed Hook框架实现个人免签支付方案

    我的个人网站如何实现支付功能? 想必很多程序员都有过想开发一个自己的网站来获得一些额外的收入,但做这件事会遇到支付这个问题.目前个人网站是无法实现支付功能的. 今天我就给大家分享一下我的实现方案:&l ...

  9. 算法编程题积累(4)——腾讯笔试"有趣的数字“问题

    本题基本思路:先对原序列进行排序,再根据不同情况采用不同算法. 首先差最大的对数最好求:用最小的数的个数 × 最大的数的个数即可. 接着求差最小的对数: 1.当序列中无重复关键字时:可知最小差必然产生 ...

  10. pycharm的部分个性化设置及快捷键

    pycharm的个性化设置 下面记录了一些最基础的个性化设置,想要更多的修改设置,可以参考其他博文. file --> settings --> editor -->general ...