前言

介绍一下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. AI大模型加速RPAxAI时代到来,谁会是RPA领域的杀手级应用?

    GPT等AI大模型震撼来袭,基于RPA的超级自动化仍是最佳落地载体 对话弘玑CPO贾岿,深入了解国产RPA厂商对AI大模型的探索与实践 文/王吉伟 关于RPA已死的说法,在中国RPA元年(2019年) ...

  2. 专访实在智能孙林君:颠覆传统RPA的实在IPA模式如何做到真正人人可用?

      王吉伟对话实在智能孙林君:颠覆传统引领RPA行业的实在IPA模式是如何炼成的? 王吉伟对话实在智能孙林君:为什么第一款颠覆行业的RPA诞生在实在智能? 专访实在智能孙林君:打造出真正人人可用的实在 ...

  3. RPA能否创造新业态?如何优化组织结构?如何助力疫情中的企业?

    RPA能否创造新业态?如何优化组织结构?如何助力疫情中的企业? 从<爱,死亡和机器人>探讨强人工智能时代的RPA发展 文/王吉伟 本周四,王吉伟频道参加了私域流量社群的一个直播活动. 活动 ...

  4. 本地部署FastGPT使用在线大语言模型

    FastGPT 是一个基于 LLM 大语言模型的知识库问答系统,提供开箱即用的数据处理.模型调用等能力,它背后依赖OneApi开源项目来访问各种大语言模型提供的能力.各大语言模型提供的访问接口规范不尽 ...

  5. KEIL5新建工程0810

    在保存各种项目的文件夹内创建一个项目文件夹1新建工程到文件夹1 选择芯片添加工程的必要文件(固件库) STM32程序是从启动文件开始,复制这些文件到文件夹A的新建Start文件夹下 stm32f10x ...

  6. 对象遍历 Object.keys(obj).forEach(name=> {})

    Object.keys(props).forEach(name => { watch[name] = function (value) { this.columnConfig.update(na ...

  7. 求正整数 n 的所有正因数的个数,qq 次询问。

    https://ac.nowcoder.com/acm/contest/22769/A 链接:https://ac.nowcoder.com/acm/contest/22769/A来源:牛客网 时间限 ...

  8. Java基础知识篇04——数组

    哈喽,大家好!我是白夜,今天给大家聊聊数组. 一.概念 计算机在内存区域分配的一段连续的区域(空间),用来存储同种类型的多个数据 简单的理解,数组就是一堆盒子,同一时间,可以保存多个相同数据类型的数据 ...

  9. 记录--图解 Vue 响应式原理

    这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 最近部门分享,有同学提到了 Vue 响应式原理,大家在讨论时,发现一些同学对这一知识理解还不够深入,不能形成一个闭环,为了帮助大家理解这个 ...

  10. 绘制三元图、颜色空间图:R语言代码

      本文介绍基于R语言中的Ternary包,绘制三元图(Ternary Plot)的详细方法:其中,我们就以RGB三色分布图为例来具体介绍.   三元图可以从三个不同的角度反映数据的特征,因此在很多领 ...