前言

介绍一下es6 的set 和 weakset

正文

set

ES6 提供了新的数据结构 Set。它类似于数组,但是成员的值都是唯一的,没有重复的值。

Set 本身是一个构造函数,用来生成 Set 数据结构。

{
let list = new Set();
list.add(5);
list.add(7);
console.log(list.size); //2
}

Set 函数可以接受一个数组作为参数,用来初始化。

{
let arr = [1,2,3,4,5];
let list = new Set(arr);
console.log(list.size); //5
}

Set中重复的元素不会添加,可以用于去重

Set不会转换数据类型,数字就是数字,字符串就是字符串

{
let arr=[1,2,3,1,'2']
let list2=new Set(arr);
console.log(list2); //Set(4) {1, 2, 3, "2"}
}

在 Set 内部,两个NaN是相等。

let set = new Set();
let a = NaN;
let b = NaN;
set.add(a);
set.add(b);
set // Set {NaN}

两个对象总是不相等的。

let set = new Set();
set.add({});
set.size // 1
set.add({});
set.size // 2

Set 实例的属性和方法

Set 实例的方法分为两大类:操作方法(用于操作数据)和遍历方法(用于遍历成员)

四个操作方法:

add(value):添加某个值,返回 Set 结构本身。

delete(value):删除某个值,返回一个布尔值,表示删除是否成功。

has(value):返回一个布尔值,表示该值是否为Set的成员。

clear():清除所有成员,没有返回值。

{
let arr=['add','delete','clear','has'];
let list=new Set(arr); console.log(list.has('add')); //true
console.log(list.delete('add'),list);
//true Set(3){"delete", "clear", "has"}
list.clear(); //清空
console.log(list); // Set(0){}
}
{
let arr=['add','delete','clear','has'];
let list=new Set(arr); for(let key of list.keys()){
console.log(key); // add delete clear has
}
for(let value of list.values()){
console.log(value); // add delete clear has
}
for(let [key,value] of list.entries()){
console.log(key,value);
// add add delete delete clear clear has has
} list.forEach(function(item){console.log(item);})
// add delete clear has
}

Set 结构的实例默认可遍历,它的默认遍历器生成函数就是它的values方法。

{
let arr=['add','delete','clear','has'];
let list=new Set(arr); for(let key of list.keys()){
console.log(key); // add delete clear has
}
for(let value of list.values()){
console.log(value); // add delete clear has
}
for(let [key,value] of list.entries()){
console.log(key,value);
// add add delete delete clear clear has has
} list.forEach(function(item){console.log(item);})
// add delete clear has
}

这意味着,可以省略values方法,直接用for...of循环遍历 Set。

{
let set = new Set(['red', 'green', 'blue']);
for (let x of set) {
console.log(x);
}

WeakSet

WeakSet 的成员只能是对象,而不能是其他类型的值。

{
let weakList=new WeakSet();
let arg={};
weakList.add(arg);
console.log(weakList); //{{}} } const ws = new WeakSet();
ws.add(1)
// TypeError: Invalid value used in weak set
ws.add(Symbol())
// TypeError: invalid value used in weak set

WeakSet 可以接受一个数组或类似数组的对象作为参数。

{const a = [[1, 2], [3, 4]];
const ws = new WeakSet(a);
console.log(ws)}
//WeakSet {Array(2), Array(2)}
//__proto__:WeakSet
//[[Entries]]:Array(2)
//0:Array(2)
//value:(2) [3, 4]
//1:Array(2)
//value:(2) [1, 2]
//length:2

注意,是a数组的成员成为 WeakSet 的成员,而不是a数组本身。这意味着,数组的成员只能是对象。

{
const b = [3, 4];
const ws = new WeakSet(b);
// Uncaught TypeError: Invalid value used in weak set(…)
}
WeakSet 结构有以下三个方法。 add(value):添加某个值,返回 WeakSet结构本身。
delete(value):删除某个值,返回一个布尔值,表示删除是否成功。
has(value):返回一个布尔值,表示该值是否为WeakSet的成员。
const ws = new WeakSet();
const obj = {};
const foo = {}; ws.add(window);
ws.add(obj); ws.has(window); // true
ws.has(foo); // false ws.delete(window);
ws.has(window); // false

WeakSet 没有size属性,没有办法遍历它的成员。

WeakSet 没有size属性,没有办法遍历它的成员。
ws.size // undefined
ws.forEach // undefined

js es6 介绍set,WeakSet的更多相关文章

  1. vue框架入门和ES6介绍

    vue框架入门和ES6介绍 vue-mvvm模式,vue是一种轻量级的前端框架,主要为模板渲染,数据同步,组件化,模块化,路由等. https://cn.vuejs.org/ 源码:https://g ...

  2. JDK中内嵌JS引擎介绍及使用

    原文: JDK中内嵌JS引擎介绍及使用 - Stars-One的杂货小窝 最近研究阅读这个APP,其主要功能就是通过一个个书源,从而实现移动端阅读的体验 比如说某些在线小说阅读网站,会加上相应的广告, ...

  3. doT.js详细介绍

    doT.js详细介绍   doT.js特点是快,小,无依赖其他插件. 官网:http://olado.github.iodoT.js详细使用介绍 使用方法:{{= }} for interpolati ...

  4. Web3D编程入门总结——WebGL与Three.js基础介绍

    /*在这里对这段时间学习的3D编程知识做个总结,以备再次出发.计划分成“webgl与three.js基础介绍”.“面向对象的基础3D场景框架编写”.“模型导入与简单3D游戏编写”三个部分,其他零散知识 ...

  5. Node.js简单介绍并实现一个简单的Web MVC框架

    编号:1018时间:2016年6月13日16:06:41功能:Node.js简单介绍并实现一个简单的Web MVC框架URL :https://cnodejs.org/topic/4f16442cca ...

  6. 【js】IE、FF、Chrome浏览器中的JS差异介绍

    如何判断浏览器类型 转:http://www.cnblogs.com/carekee/articles/1854674.html 1.通过浏览器特有的对象 如ie 的ActiveXObject  ff ...

  7. js es6 map 与 原生对象区别

    区别 object和Map存储的都是键值对组合.但是: object的键的类型是 字符串: map的键的类型是 可以是任意类型: 另外注意,object获取键值使用Object.keys(返回数组): ...

  8. js cookie介绍和实例(用于自动登录,记住用户名等)

    js cookie介绍和实例(用于自动登录,记住用户名等) 一.总结 1.cookie在客户端:因为js是最初是用来在客户端和服务器端进行通信使用的,所以客户端比如js可以操作cookie正常 2.c ...

  9. Node.js NPM 介绍

    章节 Node.js NPM 介绍 Node.js NPM 作用 Node.js NPM 包(Package) Node.js NPM 管理包 Node.js NPM Package.json NPM ...

  10. JS面向对象介绍

    JS面向对象介绍 首先面向对象是什么?为什么要使用面向对象. 因为JavaScript对每个创建的对象都会自动设置一个原型(谷歌火狐中是proto),指向它的原型对象prototype,举个例子: f ...

随机推荐

  1. Ubuntu 离线安装软件包

    Ubuntu 离线安装软件包 关键词:apt-offline,Ubuntu,dpkg,.deb 本文使用的ubuntu20.04,当机器无法连接外网时,我们使用离线的方式安装软件包. 离线安装的软件包 ...

  2. MYSQL索引-下

    前言 丁奇老师的 MYSQL45讲 的关于索引的的两节 深入浅出索引,做个笔记 覆盖索引 插入一个实例表 mysql> create table T ( ID int primary key, ...

  3. XAF Blazor FilterPanel 布局样式

    从上一篇关于ListView布局样式的文章中,我们知道XAFBlazor是移动优先的,如果想在PC端有更好的用户体验,我们需要对布局样式进行修改.这篇介绍在之前文章中提到的FilterPanel,它的 ...

  4. left jon连接查询踩坑记

    项目开发中经常会使用到多张表进行关联查询,比如left join关联查询. 如果有一张表A和一张表B,查询语句 SELECT a.*,b.name from A a left join B b On ...

  5. t w 不连读,只不过离得很近 twins twelve 单词发音

    t w 不连读,只不过离得很近 twins twelve

  6. vscode 格式化 vue 等文件的 配置 eslint vetur prettier Beautify

    需求 自动格式化需求 多行回车 合并一行,去分号 最后一个逗号,自动删除,符合eslint 结果 虽然能用了,但是 百度好几个方案,也不知道哪个对哪个,太忙没时间弄了. 配置文件记录 eslint 得 ...

  7. pandas DataFrame内存优化技巧:让数据处理更高效

    Pandas无疑是我们数据分析时一个不可或缺的工具,它以其强大的数据处理能力.灵活的数据结构以及易于上手的API赢得了广大数据分析师和机器学习工程师的喜爱. 然而,随着数据量的不断增长,如何高效.合理 ...

  8. day10-面向对象

    面向对象 1.什么是面向对象? 1.1面向过程&&面向对象 面向过程思想: 步骤清晰简单,第一步做什么,第二步做什么-- 面对过程适合处理一些较为简单地问题 面向对象思想 物以类聚,分 ...

  9. System.out.print重定向到文件实例

    该代码可以实现让System.out.print输出内容不再打印到控制台,而是输出到指定的文件中 <strong><span style="font-size:24px;& ...

  10. Android源码在线查看网站

    一.aospxref http://aospxref.com/ 优点:更新速度快 缺点:历史版本较少 二.androidxref http://androidxref.com/ 优点:历史版本较多 缺 ...