ES6学习笔记(二)
Set 和 Map 数据结构
1.set
基本用法
ES6提供了新的数据结构Set,它类似于数组,但是成员的值都是唯一的,没有重复的值
Set本身是一个构造函数,用来生成Set数据结构
const s = new Set();
[2,3,5,4,5,2,2].forEach(x => s.add(x))
for (let i of s) {
console.log(i);
}
// 2 3 5 4
上面代码通过add()方法向Set结构加入成员,结果表明Set结构不会添加重复的值
Set
函数可以接受一个数组(或者具有 iterable 接口的其他数据结构)作为参数,用来初始化。
// 例一
const set = new Set([1, 2, 3, 4, 4]);
[...set]
// [1, 2, 3, 4] // 例二
const items = new Set([1, 2, 3, 4, 5, 5, 5, 5]);
items.size // // 例三
const set = new Set(document.querySelectorAll('div'));
set.size // // 类似于
const set = new Set();
document
.querySelectorAll('div')
.forEach(div => set.add(div));
set.size //
上面代码中,例1和例2都是Set函数接受数组作为参数,例3是接受类似数组的对象作为参数
上面代码也展示了一种去除数组重复成员的方法。
// 去除数组的重复成员
[...new Set(array)]
上面的方法也可以用于,去除字符串里面的重复字符。
[...new Set('ababbc')].join('')
// "abc"
向 Set 加入值的时候,不会发生类型转换,所以5
和"5"
是两个不同的值。Set 内部判断两个值是否不同,使用的算法叫做“Same-value-zero equality”,它类似于精确相等运算符(===
),主要的区别是NaN
等于自身,而精确相等运算符认为NaN
不等于自身。
let set = new Set();
let a = NaN;
let b = NaN;
set.add(a);
set.add(b);
set // Set {NaN}
上面代码向 Set 实例添加了两个NaN
,但是只能加入一个。这表明,在 Set 内部,两个NaN
是相等。
另外,两个对象总是不相等的。
let set = new Set(); set.add({});
set.size // set.add({});
set.size //
上面代码表示,由于两个空对象不相等,所以它们被视为两个值。
Array.from
方法可以将 Set 结构转为数组。
const items = new Set([1, 2, 3, 4, 5]);
const array = Array.from(items);
这就提供了去除数组重复成员的另一种方法。
function dedupe(array) {
return Array.from(new Set(array));
} dedupe([1, 1, 2, 3]) // [1, 2, 3]
ES6学习笔记(二)的更多相关文章
- ES6学习笔记<二>arrow functions 箭头函数、template string、destructuring
接着上一篇的说. arrow functions 箭头函数 => 更便捷的函数声明 document.getElementById("click_1").onclick = ...
- ES6学习笔记(二)——字符串扩展
相信很多人也和我一样,不喜欢这样循规蹈矩的逐条去学习语法,很枯燥乏味.主要是这样学完一遍之后,没过一段时间就忘到九霄云外了.不如实际用到的时候研究它记得牢靠,所以我就整理成笔记,加深记忆的同时便于复习 ...
- ES6学习笔记二
字符串遍历 var str = 'hello'; for(let s of str){console.log(s += ' ')} //h e l l o 字符串查找:添加了include(str,i ...
- ES6学习笔记二:各种扩展
转载请注明原文地址:http://www.cnblogs.com/ygj0930/p/7242967.html 一:字符串扩展 1:字符串遍历器 for (let char of str) { // ...
- es6学习笔记二:生成器 Generators
今天这篇文章让我感到非常的兴奋,接下来我们将一起领略ES6中最具魔力的特性. 为什么说是“最具魔力的”?对于初学者来说,此特性与JS之前已有的特性截然不同,可能会觉得有点晦涩难懂.但是,从某种意义上来 ...
- ES6学习笔记<五> Module的操作——import、export、as
import export 这两个家伙对应的就是es6自己的 module功能. 我们之前写的Javascript一直都没有模块化的体系,无法将一个庞大的js工程拆分成一个个功能相对独立但相互依赖的小 ...
- ES6学习笔记<四> default、rest、Multi-line Strings
default 参数默认值 在实际开发 有时需要给一些参数默认值. 在ES6之前一般都这么处理参数默认值 function add(val_1,val_2){ val_1 = val_1 || 10; ...
- ES6学习笔记<三> 生成器函数与yield
为什么要把这个内容拿出来单独做一篇学习笔记? 生成器函数比较重要,相对不是很容易理解,单独做一篇笔记详细聊一聊生成器函数. 标题为什么是生成器函数与yield? 生成器函数类似其他服务器端语音中的接口 ...
- ES6学习笔记<一> let const class extends super
学习参考地址1 学习参考地址2 ECMAScript 6(以下简称ES6)是JavaScript语言的下一代标准.因为当前版本的ES6是在2015年发布的,所以又称ECMAScript 2015:也 ...
随机推荐
- 使用CTE生成辅助表(数字或时间)等
数字辅助表: , ;WITH Digital_Rangs(Digital) AS ( SELECT @start_digital UNION ALL FROM [Digital_Rangs] WHER ...
- 存储过程为参数NULL时的处理方法
准备一些数据: SET ANSI_NULLS ON GO SET QUOTED_IDENTIFIER ON GO CREATE TABLE [dbo].[Goods]( ) NULL, ) NULL, ...
- react中循环节点的方式以及图片引用的方式
import React from 'react' import img from '../public/img/001.jpg' // 此时img是一个变量,在下面直接使用该变量即可引入该图片 cl ...
- qscoj#19D(单调队列)
题目链接:http://qscoj.cn/problem/130/ 题意:中文题诶- 思路:直接用单调栈搞一下就好了 代码: #include <bits/stdc++.h> using ...
- Vue培训项目总结
昨天是最后一次给同事进行Vue的培训,这次培训主要是以基础入门为主. 整篇讲义参考了一些文章:https://gitbook.cn/gitchat/column/5a4af1c5658b7c0d9eb ...
- java使用Robot类在eclipse上实现自动编写代码
运行时,把输入法关掉,切换成系统自带的输入法即可: 第二个类是自定义的键值Map集合,主要是为了方便输入字符串,有需要的可以自行添加: 主要的代码如下,会创建一个名称为Automaton.java的类 ...
- SpringBoot2.0 基础案例(13):基于Cache注解模式,管理Redis缓存
本文源码 GitHub地址:知了一笑 https://github.com/cicadasmile/spring-boot-base 一.Cache缓存简介 从Spring3开始定义Cache和Cac ...
- Acwing 98-分形之城
98. 分形之城 城市的规划在城市建设中是个大问题. 不幸的是,很多城市在开始建设的时候并没有很好的规划,城市规模扩大之后规划不合理的问题就开始显现. 而这座名为 Fractal 的城市设想了这样 ...
- 在centos中安装最新版nginx,同时更改官方文档路径错误
nginx的可以使用各平台的默认包来安装,本文是介绍使用源码编译安装,包括具体的编译参数信息. 正式开始前,编译环境gcc g ++开发库之类的需要提前装好,这里默认你已经装好. ububtu平台编译 ...
- PHP命名大小写敏感规则
一直觉得PHP中各种大小写规则理不清,就连工作多年的老手们也不一定能对PHP大小写敏感问题足够了解.在PHP中,大小写敏感问题的处理比较乱,大家一定要注意.即使某些地方大小写不敏感,但在编程过程中能始 ...