ES6中如何使用Set和WeakSet_javascript技巧
ES6中提供了两新数据结构-Set和WeakSet。Set是类似于数组,但是成员变量的值都是唯一的,没有重复的值。WeakSet也是不重复的值的集合,但是只能用来存放对象。
一、Set使用
(1)Set本身提供了一个构造函数,用来生成Set数据结构。
var s = new Set(); [2,2,2,5,8,16,2,1].map(x => s.add(x)) for(i of s){console.log(i)} //2,5,8,16,1
(2)Set()函数可以接受一个数组,作为构造参数,用于做初始化。
var s = new Set([1,2,3,4,2,4,3]); [...s] //[1,2,3,4]
注意:向Set中加入值的时候不会发生类型转换,所以5和”5”是两个不同的值,Set内部判断两个值是否相等,使用的是 ===,这就意味着这两个对象总是不相等。唯一列外的是NaN本身(精确相等运算符认为NaN不等于自身)
let set = new Set(); set.add({}) set.size//1 set.add({}) set.size//2
则,上面的代码表示,由于这两个空对象不是精确相等,所以是两个不同的值。
(3)Set的方法和属性
(3.1)Set的属性
Set.prototype.size:返回Set实例的成员数量。
Set.prototype.constructor:默认的构造Set函数。
(3.2)Set的操作啊函数
add(value):添加某个值,返回Set结构本身。
delete(value):删除某个值,返回一个布尔值,表示删除成功。
has(value):返回一个布尔值,表示参数是否为Set的成员。
clear():清除所有成员,没有返回值。
var set = new Set();
set.add(1).add(2).add(22).add(22);
set.size//3
set.hae(22)//true
set.has(4)//false
set.delete(2)//true
(3.3)Set遍历操作
Set有四个遍历方法。可以用于遍历成员。
keys() :返回一个键名的遍历器
values() :返回一个值的遍历器
entries() :返回一个键值对的遍历器
forEach():使用回调函数遍历每个成员
注意:由于Set没有键名,只有值名,keys()和values()返回的结果是一样,
let set = new Set(['red','green','blue']); for(let item of set.keys()){ console.log(item); } //red,green,blue for(let item of set.values()){ console.log(item); } //red,green,blue for(let item of set.entries()){ console.log(item); } //["red","red"] //["green","green"] //["blue","blue"] //所以,entries方法返回的遍历器同时包括键名和值,所以每次输出的是一个数组。其实成员都是完全一样的。
注意:Set默认的可遍历,其默认遍历器生成函数就是它的values方法。
这就意味着,可以省略values方法,直接用for…of遍历。
var set = new Set([1,2,3,4]); for(let x of set){ console.log(x); } //1 //2 //3 //4
如果使用扩展运算符(…)内部使用for…of 循环,所以也可以用于Set结构。
let set = new Set(['red','green','blue']); let arr = [...set]; //['red','green','blue'];
(3.4)Set实现并集,交集,差集
let set1 = new Set([1,2,3,4,5,6]); let set2 = new Set([4,5,6,7,8,9]); //并集 let union = new Set([...set1,...set2]); //[1,2,3,4,5,6,7,8,9] //交集 let intersect = new Set([...set1].filter(x => b.has(s))); //[4,5,6] //差集 let intersect = new Set([...set1].filter(x => !b.has(s))); //[1,2,3,4]
(3.5)Set实现forEach的使用
let set = new Set([1,2,3,4,5,6]); set.forEach(value,key)=>consloe.log(vlaue+1); //2 //3 //4 //5 //6 //7
注意:forEach方法的参数就是一个处理函数,该函数依次为(键值,键名)集合本身。另外,forEach方法还有第二个参数,表示绑定this的对象。
二、WeakSet使用
WeakSet类似于Set,也是不重复的值的集合。但是它只能用于存储对象。而不能是其他类型的值。
WeakSet是一个个构造函数。可以接受数组和类似数组的对象作为参数。(实际上,任何具作为iterable接口的对象都可以作为WeakSet的参数)。该数组的所有成员都会自动成为WeakSet的实例对象的成员。
var a = new [[1,2],[3,4]];
var ws = new WeakSet(a);
var ws = new WeakSet(); ws.add(1);//TypeError:Invalid value used in weak set ws.add(Symbol);//TypeError:Invalid value used in weak set
添如一个数值和一个Symbol,结果同时报错。
WeakSet结构有以下的上方法
WeakSet.protoptype.add(value):向WeakSet实例添加一个新成员。
WeakSet.protoptype.delete(value):删除WeakSet实例指定成员。
WeakSet.protoptype.has(value):返回一个布尔值,表示某个值是否在WeakSet实例中。
var ws = new WeakSet(); var obj = {}; var foo = {}; ws.add(window); ws.add(obj); ws.has(window);//true ws.has(foo);false ws.delete(window);//true ws.has(window);//false
WeakSet 不能遍历,是因为成员都是弱引用,随时可能消失,遍历不能保证成员的存在。可能刚刚遍历结束,成员就取不到了。WeakSet的一个用处是存储DOM节点,而不用担心这些节点从文档移除时,会引起内存的泄露。

热AI工具

Undresser.AI Undress
人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool
免费脱衣服图片

Clothoff.io
AI脱衣机

AI Hentai Generator
免费生成ai无尽的。

热门文章

热工具

记事本++7.3.1
好用且免费的代码编辑器

SublimeText3汉化版
中文版,非常好用

禅工作室 13.0.1
功能强大的PHP集成开发环境

Dreamweaver CS6
视觉化网页开发工具

SublimeText3 Mac版
神级代码编辑软件(SublimeText3)

MyBatis动态SQL标签解读:Set标签用法详解MyBatis是一个优秀的持久层框架,它提供了丰富的动态SQL标签,可以灵活地构建数据库操作语句。其中,Set标签是用于生成UPDATE语句中SET子句的标签,在更新操作中非常常用。本文将详细解读MyBatis中Set标签的用法,以及通过具体的代码示例来演示其功能。什么是Set标签Set标签用于MyBati

在ES6中,可以利用数组对象的reverse()方法来实现数组反转,该方法用于颠倒数组中元素的顺序,将最后一个元素放在第一位,而第一个元素放在最后,语法“array.reverse()”。reverse()方法会修改原始数组,如果不想修改需要配合扩展运算符“...”使用,语法“[...array].reverse()”。

async是es7的。async和await是ES7中新增内容,是对于异步操作的解决方案;async/await可以说是co模块和生成器函数的语法糖,用更加清晰的语义解决js异步代码。async顾名思义是“异步”的意思,async用于声明一个函数是异步的;async和await有一个严格规定,两者都离不开对方,且await只能写在async函数中。

步骤:1、将两个数组分别转为set类型,语法“newA=new Set(a);newB=new Set(b);”;2、利用has()和filter()求差集,语法“new Set([...newA].filter(x =>!newB.has(x)))”,差集元素会被包含在一个set集合中返回;3、利用Array.from将集合转为数组类型,语法“Array.from(集合)”。

为了浏览器兼容。ES6作为JS的新规范,加入了很多新的语法和API,但现代浏览器对ES6新特性支持度不高,所以需将ES6代码转为ES5代码。在微信web开发者工具中,会默认使用babel将开发者ES6语法代码转换为三端都能很好支持的ES5的代码,帮助开发者解决环境不同所带来的开发问题;只需要在项目中配置勾选好“ES6转ES5”选项即可。

在es6中,暂时性死区是一个语法错误,是指let和const命令使区块形成封闭的作用域。在代码块内,使用let/const命令声明变量之前,该变量都是不可用的,在变量声明之前属于该变量的“死区”;这在语法上,称为“暂时性死区”。ES6规定暂时性死区和let、const语句不出现变量提升,主要是为了减少运行时错误,防止在变量声明前就使用这个变量,从而导致意料之外的行为。

map是有序的。ES6中的map类型是一种储存着许多键值对的有序列表,其中的键名和对应的值支持所有数据类型;键名的等价性判断是通过调用“Objext.is()”方法来实现的,所以数字5与字符串“5”会被判定为两种类型,可以分别作为两种独立的键出现在程序中。
