ES6 Set结构的应用实例分析


Posted in Javascript onJune 26, 2019

本文实例讲述了ES6 Set结构的应用。分享给大家供大家参考,具体如下:

Set 类似于数组,但是成员的值都是唯一的,没有重复的值, 实现了iterator接口

set 的值不可重复,数组的值可以重复

let arr = [1,2,3,'5','5'];
let st = new Set(arr);
console.log(st); // 可以通过set来去除数组的重复的值,返回的是一个伪数组
console.log(st.size); // 4

set 的 add , delete, has, clear 方法

简单的add 与 delete :

let st = new Set();
var u = {name:'Joh'};
st.add(u);
let bool = st.delete(u);
console.log(bool); // true;

连续add与has的api :

let st = new Set();
var u = {name:'Joh'};
var r = {name:'Lily'};
st.add(u).add(r);
let bool = st.delete(r);
console.log(bool); // true
console.log(st.has(r)); // false
console.log(st.has(u)); // true;

clear清空set集合

let st = new Set();
var u = {name:'Joh'};
var r = {name:'Lily'};
st.add(u).add(r);
st.clear();
console.log(st.size); // 0

通过Array.from方法把类似数组结构的模型转化为数组

let arr = ['xxx', 'yyyy', 'yyyy'];
let newArr = Array.from(new Set(arr));
console.log(Array.isArray(newArr)); // true
console.log(newArr); // ["xxx", "yyyy"]

Set 原型上的Symbol.iterator 和 values 是同一个值, 可直接for-of遍历

console.log(Set.prototype[Symbol.iterator] === Set.prototype.values); // true
let st = new Set(['xxx', 'yyyy', 'yyyy', 'John']);
for(let k of st) {
 console.log(k); // 依次输出 xxx yyyy John 可以直接遍历,兼容map的数据结构
}

set中的keys和values方法

let st = new Set(['xxx', 'yyyy', 'yyyy', 'John']);
console.log(st.size); // 3
let itKeys = st.keys();
for(let k of itKeys) {
   console.log(k); // 依次输出 xxx yyyy John
}
console.log('>>>>>');
let itVals = st.values();
for(let v of itVals) {
   console.log(v); // 依次输出 xxx yyyy John
}

set 的entries 实体对象,是个键和值的数组结构

let st = new Set(['xxx', 'yyyy', 'yyyy', 'John']);
let entriesIt = st.entries(); //
for(let v of entriesIt) {
 console.log(v); // 依次输出 ["xxx", "xxx"] ["yyyy", "yyyy"] ["John", "John"]
}

关于NaN在set中的特殊性

let st = new Set();
console.log(NaN === NaN); // false , 此处 NaN 是不全等的,理应可以添加多个,不算重复,但是这里是个特例
st.add(NaN).add(NaN).add(NaN);
for(let v of st) {
 console.log(v); // 只输出一个 NaN
}

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
JavaScript各类型的关系图解
Oct 16 Javascript
实例代码讲解jquery easyui动态tab页
Nov 17 Javascript
Node.js中JavaScript操作MySQL的常用方法整理
Mar 01 Javascript
json传值以及ajax接收详解
May 24 Javascript
Bootstrap3制作搜索框样式的方法
Jul 11 Javascript
js 声明数组和向数组中添加对象变量的简单实例
Jul 28 Javascript
原生js仿jquery一些常用方法(必看篇)
Sep 20 Javascript
微信小程序 教程之注册页面
Oct 17 Javascript
js继承实现方法详解
Dec 16 Javascript
利用jQuery+localStorage实现一个简易的计时器示例代码
Dec 25 jQuery
Vue 自定义指令功能完整实例
Sep 17 Javascript
vue 关闭浏览器窗口的时候,清空localStorage的数据示例
Nov 06 Javascript
vue.js实现备忘录demo
Jun 26 #Javascript
ES6 Map结构的应用实例分析
Jun 26 #Javascript
vue实现日历备忘录功能
Sep 24 #Javascript
ES6 Array常用扩展的应用实例分析
Jun 26 #Javascript
Vue.js实现备忘录功能
Jun 26 #Javascript
微信小程序数据统计和错误统计的实现方法
Jun 26 #Javascript
Vue移动端右滑屏幕返回上一页附源码下载
Jun 26 #Javascript
You might like
phpmyadmin操作流程
2006/10/09 PHP
php判断两个浮点数是否相等的方法
2015/03/14 PHP
PHP基于关联数组20行代码搞定约瑟夫问题示例
2017/11/07 PHP
推荐40款强大的 jQuery 导航插件和教程(上篇)
2012/09/14 Javascript
a标签的href与onclick事件的区别详解
2014/11/12 Javascript
javascript弹出页面回传值的方法
2015/01/28 Javascript
JS数组array元素的添加和删除方法代码实例
2015/06/01 Javascript
有关Promises异步问题详解
2015/11/13 Javascript
iscroll-probe实现下拉刷新和下拉加载效果
2017/06/28 Javascript
微信页面弹出键盘后iframe内容变空白的解决方案
2017/09/20 Javascript
web前端vue之CSS过渡效果示例
2018/01/10 Javascript
vue项目每30秒刷新1次接口的实现方法
2018/12/04 Javascript
JavaScript中reduce()的5个基本用法示例
2020/07/19 Javascript
python读取Android permission文件
2013/11/01 Python
Python 的 with 语句详解
2014/06/13 Python
用python + hadoop streaming 分布式编程(一) -- 原理介绍,样例程序与本地调试
2014/07/14 Python
PyQt5每天必学之带有标签的复选框
2018/04/19 Python
python 读取文件并替换字段的实例
2018/07/12 Python
python 3.7.0 下pillow安装方法
2018/08/27 Python
python 与服务器的共享文件夹交互方法
2018/12/27 Python
Python3+Pycharm+PyQt5环境搭建步骤图文详解
2019/05/29 Python
如何使用Cython对python代码进行加密
2020/07/08 Python
numpy中生成随机数的几种常用函数(小结)
2020/08/18 Python
HTML5自定义元素播放焦点图动画的实现
2019/09/25 HTML / CSS
域名注册、建站工具、网页主机、SSL证书:Dynadot
2017/01/06 全球购物
DC Shoes荷兰官方网站:美国极限运动品牌
2019/10/22 全球购物
什么是servlet
2012/05/08 面试题
个人四风问题整改措施
2014/10/24 职场文书
旅行社计调工作总结
2015/08/12 职场文书
《实心球》教学反思
2016/02/23 职场文书
女性励志书籍推荐
2019/08/19 职场文书
详解TypeScript中的类型保护
2021/04/29 Javascript
详细总结Python常见的安全问题
2021/05/21 Python
Python入门学习之类的相关知识总结
2021/05/25 Python
Lombok的详细使用及优缺点总结
2021/07/15 Java/Android
Javascript中Microtask和Macrotask鲜为人知的知识点
2022/04/02 Javascript