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+ 现在就用系列(四):箭头函数 => ...
随机推荐
- Dubbo配合SpringBoot,实现接口多个实现(group)
SpringBoot配合Dubbo,使用@Service和@Reference,group实现接口多实现 公司项目升级,需要实现springBoot + Dubbo,并支持一个接口多个实现的情况.遇到 ...
- PHP 输出XML字符串
<?php echo htmlentities( $xml_string);?>
- Unity5-ABSystem(二):AssetBundle导出
版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明.本文链接:https://blog.csdn.net/lodypig/article/detai ...
- windows下搭建开发环境
PHP集成开发环境有很多,如XAMPP.AppServ......只要一键安装就把PHP环境给搭建好了.但这种安装方式不够灵活,软件的自由组合不方便,同时也不利于学习.所以我还是喜欢手工搭建PHP开发 ...
- NLP预训练模型-百度ERNIE2.0的效果到底有多好【附用户点评】
ERNIE是百度自研的持续学习语义理解框架,该框架支持增量引入词汇(lexical).语法 (syntactic) .语义(semantic)等3个层次的自定义预训练任务,能够全面捕捉训练语料中的词法 ...
- CSP-S:追忆
Warning:这一篇极其中二,开了那个大会莫名有感而发. 模拟测试17那套题啊... 开的这个大会为什么弄得我退役感如此强烈... 早就想收藏了,还是记下来吧 <入阵曲> 丹青千秋酿, ...
- Project Euler 54: Poker hands
在纸牌游戏中,一手包含五张牌并且每一手都有自己的排序,从低到高的顺序如下: 大牌:牌面数字最大 一对:两张牌有同样的数字 两对:两个不同的一对 三条:三张牌有同样的数字 顺子:所有五张牌的数字是连续的 ...
- mysql select自增变量(包括读取当前第几行)
mysql select自增变量(包括读取当前第几行) SET @rownum =0;select id,@rownum := @rownum +1 as i from ceshi order by ...
- 004.Kubernetes二进制部署创建证书
一 创建CA证书和密钥 1.1 安装cfssl工具集 [root@k8smaster01 ~]# mkdir -p /opt/k8s/cert [root@k8smaster01 ~]# curl - ...
- ctf misc 学习总结大合集
0x00 ext3 linux挂载光盘,可用7zip解压或者notepad搜flag,base64解码放到kali挂载到/mnt/目录 mount 630a886233764ec2a63f305f31 ...