前言

介绍一下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. Scriban语言手册中文版

    Scriban是一个快速.强大.安全且轻量级的模板引擎,同时兼容liquid语法规则. 项目地址:https://github.com/scriban/scriban 这个文档是语言语法的中文翻译 原 ...

  2. html5与css3新特性

    HTML5新特性 增加了一些新的标签.新的表单以及新的表单属性等 这些新特性都有兼容性问题,基本上IE9+以上版本浏览器才支持,如果不考虑兼容性问题,可以大量使用这些新特性 新增语义化标签 - < ...

  3. electron打包踩过的坑总结 好文

    electron打包踩过的坑总结 https://segmentfault.com/a/1190000018533945

  4. linux 无法找到“/usr/bin/core_perl/gcc” vscode

    解决问题的思路 查看有没有gcc,没有安装 有的话就是,修改安装路径就可以? "/usr/bin/core_perl/gcc".修改成Gcc的绝对路径 我的修改是./usr/bin ...

  5. 【算法】C和Python实现快速排序-三数中值划分选择主元(非随机)

    一.快排基础 1.1 快排的流程 将数组A进行快速排序的基本步骤-quick_sort(A): 递归基础情况:如果A中的元素个数是1或0,则返回. 选取主元:取A中的任意一个元素v,作为主元(pivo ...

  6. 17_详解YUV

    本文的主角是多媒体领域非常重要的一个概念:YUV. 简介 YUV,是一种颜色编码方法,跟RGB是同一个级别的概念,广泛应用于多媒体领域中. 也就是说,图像中每1个像素的颜色信息,除了可以用RGB的方式 ...

  7. 汽车VR虚拟仿真技术如何加速自动驾驶的发展?

    虚拟现实和虚拟仿真将带领自动驾驶汽车从汽车研发.体验.展厅.销售等各个环节迈入全新时代.2019 年,全球增强现实和虚拟现实市场为168 亿美元,到 2023 年,该市场的未来增长预计将超过 1600 ...

  8. 「AntV」全球AQI数据获取与L7可视化

    1. 引言 L7 地理空间数据可视分析引擎是一种基于 WebGL 技术的地理空间数据可视化引擎,可以用于实现各种地理空间数据可视化应用.L7 引擎支持多种数据源和数据格式,包括 GeoJSON.CSV ...

  9. 开发必会系列:hibernate事务

    一  事务定义及特性 1.数据库事务的定义:数据库事务(Database Transaction) 是指由一个或多个SQL语句组成的工作单元,这个工作单元中的SQL语句相互依赖,如果有一个SQL语句执 ...

  10. archlinux 时间,时钟设置与详解,时区对应的时间不正确

    参照 https://wiki.archlinux.org/title/System_time 1.使用命令查看时间 timedatectl 显示类似 Local time: Wed 2024-01- ...