javascript新增加的数据结构: Set Map WeakSet WeakMap

一、Set

ES6提供新的数据结构Set,类似于Array,不过Array中的值可以重复,但是Set中的值不可以重复

声明: Set函数是一个构造函数

let set = new Set([1,2,3,2])

console.log((new Set([1,2,3,2])).size) // 3

console.log((new Set([NaN, NaN])).size) // 1

console.log((new Set([{}, {}])).size) // 2

console.log((new Set([{a: ‘a‘}, {a: ‘a‘}])).size) //2

a = {a: ‘a‘}

console.log((new Set([a, a])).size) // 1

b = {a: ‘a‘}

console.log((new Set([a, b])).size) //2

Set数据结构判断相等的方式与===类似,但是优化了NaN的判断(这里可以原来判断NaN)

Set数据结构的属性:

Set.prototype.constructor: 构造函数,默认为Set函数,new Set([1]).constructor === Set // true

Set.prototype.size: 返回Set实例的成员总数。

Set数据结构的方法

1 interface Set<T> {
2     add(value: T): this; // 增加值,返回Set实例本身,可以连调 new Set().add({}).add({})
3     clear(): void; // 清除所有值
4     delete(value: T): boolean; // 删除值,删除成功返回true
5     forEach(callbackfn: (value: T, value2: T, set: Set<T>) => void, thisArg?: any): void; // 遍历Set,接受回调函数和this对象,回调函数的参数有3个,值,键,set本身,Set数据结构中没有键,所以键===值,
6     has(value: T): boolean; // value是否在Set中
7     readonly size: number; // 返回Set的成员数量
8 }

因为Set是实现了遍历器接口,所以有如下方法

keys 返回键组成的遍历器

values 返回值组成的遍历器

entries 返回键值对组成的遍历器

Set与数组的区别

Array Set都实现了遍历器

Array中的值可以重复,但是Set中的值不可以重复

Array中有键(0,1,2),遍历可以使用arr[0]

Set中只有值,没有键,遍历可以使用forEach, for of

Set的遍历

可以直接使用for of进行遍历

Set的应用

1 // 数组去重复(基本数据类型)
2 console.log(Array.from(new Set([1,2,1]))) // [1, 2]
3 console.log([...new Set([1,2,1])]) // [1, 2]
4
5 a = [1, 2, 3]
6 b = [4, 3, 2]
7 // 数组并集
8 console.log([...new Set([...a, ...b])]) // [ 1, 2, 3, 4 ]

二、WeakSet

与Set的区别:

  1. WeakSet中的成员只能是对象,Set可以是任何类型
  2. WeakSet中的对象都是弱引用。垃圾回收是不会考虑对象在不在WeakSet中,所以WeakSet是不可引用的,是不能遍历的

添加进WeakSet的元素对象,WeakSet不会对元素对像的引用计数加1,对于被添加进WeakSet的元素对象,只要该元素对象没有被除WeakSet以外的其他对象引用,就会被垃圾回收释放,在WeakSet中的该元素对象自动被释放,不会出现内存泄漏。

1 var ws = new WeakSet();
2 var foo = {};
3 ws.add(foo);
4 console.log(ws.has(foo)) // true
5 ws.delete(foo);
6 console.log(ws.has(foo)) //false
interface WeakSet<T extends object> {
    add(value: T): this;
    delete(value: T): boolean;
    has(value: T): boolean;
}

WeakSet的一个用法是存触DOM节点,而不用担心这些节点从文档移除时发生内存泄露。

 1 class Foo {
 2     constructor() {
 3         ws.add(this);
 4     }
 5     method() {
 6         if(!ws.has(this))  {
 7             throw new TypeError(‘method只能在实例中使用‘)
 8         }
 9     }
10 }

保证Foo的实例方法只能在Foo的实例上调用。

三、Map

Object是字符串-值结构,它的键必须是字符串。

Map是值-值,它的键可以是任何类型的。

如果需要键值对的数据结构,Map更加合适。

let a = new Map([[‘name‘, ‘wt‘], [‘age‘, 25]]) 构造函数,接受数组作为参数

interface Map<K, V> {
    clear(): void;
    delete(key: K): boolean;
    forEach(callbackfn: (value: V, key: K, map: Map<K, V>) => void, thisArg?: any): void;
    get(key: K): V | undefined;
    has(key: K): boolean;
    set(key: K, value: V): this;
    readonly size: number;
}

四、WeakMap

WeakMap与Map基本相同,不过WeakMap的键必须是对象,并且是对象的弱引用。(垃圾回收机制不考虑是否在WeakMap中)

WeakMap专门用来在它的键对应的对象可能在将来会消失。有助于防止内存泄露。

1 let a = [‘name‘, ‘wt‘]
2 let m = new Map().set(a, ‘mmm‘)
3 console.log(m.get(a)) // mmm
4 a = null;
5 console.log(m.get(a)) // undefined

参考:《ES6标准入门》

原文地址:https://www.cnblogs.com/wangtingnoblog/p/10409336.html

时间: 2024-10-12 03:22:38

javascript新增加的数据结构: Set Map WeakSet WeakMap的相关文章

ES5中Array新增加的API接口 forEach map filter some every indexOf lastIndexOf reduce reduceRight

var array = [23,48,66,2]; forEach:循环.遍历数组:没有返回值.与for循环类似 array.forEach(function( value, index, array ) { console.log(value); return value * value; } ); map:映射的意思,映射返回一个新数组,有返回值;filterArr:返回一个新对象 var mapArr = array.map(function(value, index, array ){

ES6 之 Set数据结构和Map数据结构 Iterator和for...of循环

ECMAScript 6 入门 Set数据结构 基本用法 ES6提供了新的数据结构Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. Set本身是一个构造函数,用来生成Set数据结构. var s = new Set(); [2, 3, 5, 4, 5, 2, 2].map(x => s.add(x)); for (let i of s) { console.log(i); } // 2 3 5 4 上面代码通过add方法向Set结构加入成员,结果表明Set结构不会添加重复的值. 向S

ES6:JavaScript 新特性

5月14日,国务院发布了<国务院关于同意建立深化收入分配制度改革部际联席会议制度的批复>,同意建立由发改委牵头的深化收入分配制度改革部际联席会议制度.这是对政府一年多前首次发布的关于收入分配制度改革若干意见的落实,标志着中国收入分配改革迈出了实质性一步.根据批复,联席会议由国家发改委.财政部.人力资源和社会保障部等21个部门和单位组成.发改委主任徐绍史担任联席会议召集人,其他成员单位有关负责人为联席会议成员. 国务院下发的文件显示,部际联席会议制度的主要职责包括:在国务院领导下,统筹协调做好深

在android4.4上新增加keycode

keycode是android定义好的,但是有时候无法满足需要,进行定制化难免会涉及到新增加keycode.分成两部分,驱动和framework,这里主要讲解framework部分: 一.驱动部分: 1.    在下列文件中定义 如KEY_SMS #defineKEY_SMS 252 可能涉及的文件(可能还需要在别的文件): kernel\include\linux\input.h bionic\libc\kernel\common\linux\input.h external\kernel-h

新增加的html里的id,js获取不到id

if(flag==0){                var p = document.createElement("p");                  var text_p = document.createTextNode("还没有账号0?");                 p.setAttribute("class","p-rj");                 p.setAttribute("

CSS3新增加的伪类选择器

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>CSS3新增加的伪类选择器</title>    <style type="text/css">    /*root所有的元素*/        :root{            color: pink;      

Map 和 WeakMap 数据结构

Map 和 WeakMap 是ES6 新增的数据结构 一.Map 它们本质与对象一样,都是键值对的集合,但是他们与 Object 对象主要的不同是,键可以是各种类型的数值,而Object 对象的键 只能是字符串类型或者Symbol类型值,Map 和 WeakMap 是更为完善的Hash结构. 1.对象 和 Map //----------- 对象 -------------- var keyObj = {} var dataObj = {} dataObj[keyObj] = '大家好' 虽然表

css3新增加的选择器

css3新增加的选择器 一.属性选择器: E[attr] 只要有属性名E[attr=value] 属性名=属性值E[attr~=blue] 包含这个blue整个单词就可以E[attr^=c] 以这个字母c开头的E[attr$=b] 以这个字母b结尾的E[attr*=a] 只要包含a这个字母就行E[attr|=z] 只要以字母z-开头的或者就是字母z的 二.结构性伪类选择器: E:nth-child(n) 第n个子节点div:nth-child(odd) 奇数行div:nth-child(even

[原创] Easy SysLite V1.2 (2016.5.29更新,新增加WIN10支持,一个程序适配所有系统减肥)

nohacks 发表于 2016-5-29 17:12:51 https://www.itsk.com/thread-367736-1-8.html 原因是新版的 SkyIAR.Easy Image X会验证自身程序,防止被窜改,PE缺少验证SHA1的DLL解决办法把 RSAENH.DLL 文件 RSAENH.7z (60.85 KB, 下载次数: 978) 2013-1-26 11:50 上传点击文件名下载附件 下载积分: 活跃 -3 点 或者自己到XP系统SYSTEM32里提取,复制到PE核