ES6之Set
阮大神的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的更多相关文章
- ES6模块import细节
写在前面,目前浏览器对ES6的import支持还不是很好,需要用bable转译. ES6引入外部模块分两种情况: 1.导入外部的变量或函数等: import {firstName, lastName, ...
- webpack+react+redux+es6开发模式
一.预备知识 node, npm, react, redux, es6, webpack 二.学习资源 ECMAScript 6入门 React和Redux的连接react-redux Redux 入 ...
- ES6的一些常用特性
由于公司的前端业务全部基于ES6开发,于是给自己开个小灶补补ES6的一些常用特性.原来打算花两天学习ES6的,结果花了3天才勉强过了一遍阮老师的ES6标准入门(水好深,ES6没学好ES7又来了...) ...
- ES6(块级作用域)
我们都知道在javascript里是没有块级作用域的,而ES6添加了块级作用域,块级作用域能带来什么好处呢?为什么会添加这个功能呢?那就得了解ES5没有块级作用域时出现了哪些问题. ES5在没有块级作 ...
- es6小白学习笔记(一)
1.let和const命令 1.es6新增了let和const命令,与var用法类似,但它声明的变量只在let所在的代码块内有效(块级作用域,es5只有全局和函数作用域) { let a = 1; v ...
- ES6之变量常量字符串数值
ECMAScript 6 是 JavaScript 语言的最新一代标准,当前标准已于 2015 年 6 月正式发布,故又称 ECMAScript 2015. ES6对数据类型进行了一些扩展 在js中使 ...
- ES6之let命令详解
let与块级作用域 { var foo='foo'; let bar='bar'; } console.log(foo,'var'); //foo varconsole.log(bar ,'bar') ...
- ES6 箭头函数中的 this?你可能想多了(翻译)
箭头函数=>无疑是ES6中最受关注的一个新特性了,通过它可以简写 function 函数表达式,你也可以在各种提及箭头函数的地方看到这样的观点——“=> 就是一个新的 function”. ...
- ES6+ 现在就用系列(二):let 命令
系列目录 ES6+ 现在就用系列(一):为什么使用ES6+ ES6+ 现在就用系列(二):let 命令 ES6+ 现在就用系列(三):const 命令 ES6+ 现在就用系列(四):箭头函数 => ...
- ES6+ 现在就用系列(一):为什么使用ES6+
系列目录 ES6+ 现在就用系列(一):为什么使用ES6+ ES6+ 现在就用系列(二):let 命令 ES6+ 现在就用系列(三):const 命令 ES6+ 现在就用系列(四):箭头函数 => ...
随机推荐
- Modbus协议笔记
读线圈:就是说读开关量输出的状态,看看开关量输出的到底是开着的还是关着的,这样说有点不专业,但是好明白.比如要在上位机显示开关量输出的当状态,就得用这个功能码. 写线圈:就是说读开关量输入的状态,开关 ...
- Linux进程组和会话
Linux的进程相互之间有一定的关系.比如说,在Linux进程基础中,我们看到,每个进程都有父进程,而所有的进程以init进程为根,形成一个树状结构.我们在这里讲解进程组和会话,以便以更加丰富的方式了 ...
- UNIX环境高级编程 使用方法
1.解压文件到apue.2e目录2.修改相应平台的文件,我使用的是linux,所以修改Make.defines.linux你修改的只需要这一行WKDIR=/home/your_dir/apue2e_s ...
- 神舟+win10+ubuntu16.04+256GSSD+1THHD双系统安装加openssl踩坑之旅
上海最近搞活动调休,要搞深度学习,win上还是不方便,准备弄个ubuntu.于是有以下回忆文字. 在机器上装了个双系统.花了两天.再也不想玩了. 准备用ubuntu来做深度学习的. 本文写于2019年 ...
- python小练习--模拟用户登录,(3次重试机会,登录成功展示登录账号密码)
知识点使用:1.格式化输出的两种方法---% .formate 2.while循环的使用,及跳出循环的两种方法---break(跳出循环体).continue(结束本次循环,继续下次循环) 3.if条 ...
- Windows(Server)环境安装Web服务器(Apache,PHP,Mysql)图文教程
Windows下Apache+PHP+MySQL搭建web服务器的方法,windows Server Install Apache PHP MySQL(图文详解) 环境准备: Windows Serv ...
- 「刷题」Triple
正解是普通型母函数+FFT. 才学了多项式,做了一道比较好的题了. 首先有三个斧子被偷了. 我们考虑构造一种普通型母函数. 就是说一种多项式吧,我的理解. 系数是方案,下标,也就是所谓的元指数代表的是 ...
- 基于docker搭建Jenkins+Gitlab+Harbor+Rancher架构实现CI/CD操作(续)---Harbor的安装
前期安装文档:https://www.cnblogs.com/lq-93/p/11828626.html Harbor的作用: 开发提交代码至gitlab容器中,Jenkins拉取代码构建镜像 ...
- 【转载】常见十大经典排序算法及C语言实现【附动图图解】
原文链接:https://www.cnblogs.com/onepixel/p/7674659.html 注意: 原文中的算法实现都是基于JS,本文全部修改为C实现,并且统一排序接口,另外增加了一些描 ...
- AngularJS: Error reports on $injector:modulerr
Angular JS最常见的问题是,程序启动失败,error为$injector:modulerr 错误是因为加载对应的Module失败,但很难找到需要修改的Module. 一个简单的小技巧是,不要使 ...