阮大神的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. 详解k8s中的liveness和readiness的原理和区别

    liveness与readiness的探针工作方式源码解析 liveness和readiness作为k8s的探针,可以对应用进行健康探测. 二者支持的探测方式相同.主要的探测方式支持http探测,执行 ...

  2. SpringBoot整合MybatisPlus3.X之Wrapper(五)

    官方文档说明: 以下出现的第一个入参boolean condition表示该条件是否加入最后生成的sql中 以下代码块内的多个方法均为从上往下补全个别boolean类型的入参,默认为true 以下出现 ...

  3. Bran的内核开发教程(bkerndev)-07 中断描述符表(IDT)

    中断描述符表(IDT)   中断描述符表(IDT)用于告诉处理器调用哪个中断服务程序(ISR)来处理异常或汇编中的"int"指令.每当设备完成请求并需要服务事, 中断请求也会调用I ...

  4. windows vscode 远程调试代码

    需要: vscode + Remote-ssh(vscode插件中下载) openssh (https://www.mls-software.com/files/setupssh-8.0p1-2.ex ...

  5. Windows包管理器

    Windows包管理器 Scoop 参考 安装命令 set-executionpolicy remotesigned -scope currentuser #用powershell执行 iex (ne ...

  6. 博客文章编辑器 Cmd Markdown

    欢迎使用 Cmd Markdown 编辑阅读器 编辑器点击打开链接 学习语言地址点击打开链接

  7. VS环境下基于C++的单链表实现

    ------------恢复内容开始------------ #include<iostream> using namespace::std; typedef int ElemType; ...

  8. python——inspect模块

    inspect模块常用功能 import inspect # 导入inspect模块 inspect.isfunction(fn) # 检测fn是不是函数 inspect.isgenerator((x ...

  9. Web微信开发工具无法输入中文?官方bug

    Ctrl+shift+w 重启工具就OK啦

  10. SpringBoot系列之@Conditional注解用法简介

    SpringBoot系列之@Conditional注解用法简介 引用Spring官方文档的说法介绍一下@Conditional注解:Spring5.0.15版本@Conditional注解官方文档 @ ...