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

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')); //trueconsole.log(list.delete('add'),list);
//true Set(3){"delete", "clear", "has"}list.clear();     //清空console.log(list);  // Set(0){}
}

forEach()

Set 结构的实例与数组一样,也拥有forEach方法,用于对每个成员执行某种操作,没有返回值。

{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方法。

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

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

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属性,没有办法遍历它的成员。

ws.size // undefined
ws.forEach // undefined

Map

JavaScript 的对象(Object),本质上是键值对的集合(Hash 结构),但是传统上只能用字符串当作键。这给它的使用带来了很大的限制.

ES6 提供了 Map 数据结构。它类似于对象,也是键值对的集合,但是“键”的范围不限于字符串,各种类型的值(包括对象)都可以当作键。也就是说,Object 结构提供了“字符串—值”的对应,Map 结构提供了“值—值”的对应,是一种更完善的 Hash 结构实现。如果你需要“键值对”的数据结构,Map 比 Object 更合适。

const m = new Map();
const o = {p: 'Hello World'};m.set(o, 'content')
m.get(o) // "content"

m.has(o) // true
m.delete(o) // true
m.has(o) // false

Map 也可以接受一个数组作为参数。该数组的成员是一个个表示键值对的数组。

const map = new Map([['name', '张三'],['title', 'Author']
]);map.size // 2
map.has('name') // true
map.get('name') // "张三"
map.has('title') // true
map.get('title') // "Author"

如果对同一个键多次赋值,后面的值将覆盖前面的值。

const map = new Map();
map
.set(1, 'aaa')
.set(1, 'bbb');
map.get(1) // "bbb"

实例的属性和操作方法

(1)size 属性

(2)set(key, value)

(3)get(key)

(4)has(key)

(5)delete(key)

(6)clear()

{let map = new Map();
map.set('foo', 11);
map.set('bar', 22);
map.size ;// 2
map.get('foo');//t1
map.has('boo');  //true
map.delete('foo');  //true
map.clear();
map.size // 0
}

遍历方法

Map 结构原生提供三个遍历器生成函数和一个遍历方法。

  • keys():返回键名的遍历器。
  • values():返回键值的遍历器。
  • entries():返回所有成员的遍历器。
  • forEach():遍历 Map 的所有成员。

Map 结构的默认遍历器接口(Symbol.iterator属性),就是entries方法。

WeakMap

WeakMap结构与Map结构类似,也是用于生成键值对的集合。

WeakMapMap的区别有两点。

首先,WeakMap只接受对象作为键名(null除外),不接受其他类型的值作为键名。

其次,WeakMap的键名所指向的对象,不计入垃圾回收机制。

// WeakMap 可以使用 set 方法添加成员
const wm1 = new WeakMap();
const key = {foo: 1};
wm1.set(key, 2);
wm1.get(key) // 2// WeakMap 也可以接受一个数组,
// 作为构造函数的参数
const k1 = [1, 2, 3];
const k2 = [4, 5, 6];
const wm2 = new WeakMap([[k1, 'foo'], [k2, 'bar']]);
wm2.get(k2) // "bar"

WeakMap 的语法

WeakMap 与 Map 在 API 上的区别主要是两个,

一是没有遍历操作(即没有keys()values()entries()方法),也没有size属性。

二是无法清空,即不支持clear方法。因此,WeakMap只有四个方法可用:get()set()has()delete()

转载于:https://www.cnblogs.com/sunmarvell/p/9132682.html

es6之数据结构 set,WeakSet,mapWeakMap相关推荐

  1. ES6 (十三)Set 和 Map 数据结构、WeakSet 和 WeakMap、WeakRef、FinalizationRegistry

    ES6 (十三)Set 和 Map 数据结构.WeakSet 和 WeakMap.WeakRef.FinalizationRegistry 文章目录 ES6 (十三)Set 和 Map 数据结构.We ...

  2. set和map去重调用什么方法_你真的了解ES6的Set,WeakSet,Map和WeakMap吗?

    之前在学习 ES6 的时候,看到 Set 和 Map,不知道其应用场景有哪些,只觉得很多时候会用在数组去重和数据存储,后来慢慢才领悟到 Set 是一种叫做集合的数据结构,Map 是一种叫做字典的数据结 ...

  3. ES6 Map数据结构

    Map JavaScript 的对象(Object),本质上是键值对的集合(Hash 结构),但是传统上只能用字符串当作键.这给它的使用带来了很大的限制. ES6 提供了 Map 数据结构.它类似于对 ...

  4. 读阮一峰ES6—Set数据结构

    文章目录 ES6-Set的数据结构 ES6-Set的数据结构 1. 基本用法 ES6 提供了新的数据结构 Set.它类似于数组,但是成员的值都是唯一的,不会添加重复的值. const s = new ...

  5. ES6(三)——Set、WeakSet、Map、WeakMap

    一.Set的基本使用 在ES6之前,我们存储数据的结构主要有两种:数组.对象. 在ES6中新增了另外两种数据结构:Set.Map,以及它们的另外形式WeakSet.WeakMap. Set是一个新增的 ...

  6. ES6 文档总结,持续更新

    1.块的作用域     let 只能在定义他的块内使用 2.恒量     const 不能重新分配新的值     const限制的分配值这个动作,而不是限制恒量里的值,所以:     const fr ...

  7. JavaScript内存泄漏

    内存泄漏简介 内存泄漏(Memory Leak)是指程序中己动态分配的堆内存由于某种原因程序未释放或无法释放,造成系统内存的浪费,导致程序运行速度减慢甚至系统崩溃等严重后果. 内存泄漏缺陷具有隐蔽性. ...

  8. JavaScript 内存机制(前端同学进阶必备)

    JavaScript 内存机制(前端同学进阶必备) 简介 每种编程语言都有它的内存管理机制,比如简单的C有低级的内存管理基元,像malloc(),free().同样我们在学习JavaScript的时候 ...

  9. ECMAScript 6规范总结(长文慎入)

    闲话 学习ES6的动机起于对其promise标准的好奇,它与jQuery源码中Deferred不同,而且在异步编程中加入了Generator,在后续ES7中更有Async.这勾起我强烈的兴趣了解ES6 ...

最新文章

  1. 参加中国十大IT杰出博客
  2. 实验心得_大肠杆菌原核表达实验心得(上篇)
  3. 关于uint32_t uint8_t uint64_t 的问题
  4. Vim升华之树形目录插件NERDTree安装图解
  5. java分治法求数列的最大子段和_同事为进大厂天天刷Java面试题,面试却履败!究其原因竟是它在捣鬼。...
  6. springboot整合sharding-jdbc
  7. idea类前面有个j_idea中所有Java类标识变成一个J
  8. php语法介绍,PHP语法介绍
  9. 【redis】redis 各种数据类型应用和实现方式
  10. energy in transition课文翻译_思迪软件科技 招聘 字幕翻译(远程兼职)
  11. 用域控制禁止本地存盘禁止使用移动磁盘以防止图纸泄密的解决方案
  12. 11月7日简单标签与Listener培训日记
  13. cad计算机绘图基础知识,CAD 计算机绘图基础课件.ppt
  14. Ubuntu 21 英国键盘布局修改参考方案
  15. 解决Linux系统不能上网问题
  16. UI 标注工具MarkMan的测量像素使用
  17. hc sr501 c语言程序,HC-SR501人体红外感应模块资料汇总(原理图、常见问题、程序等)...
  18. 机器学习算法面经(阿里京东拼多多百度等)
  19. android模拟器华为账号,夜神模拟器怎么玩华为账号游戏
  20. 在 Java 中的一个单元格中应用多种字体

热门文章

  1. ajax jsp模糊查询源码,Ajax动态执行模糊查询功能
  2. springboot 做表白墙_华广表白墙 第六期|hsl每天都想和你嘻嘻哈哈
  3. 修改oracle rac sid,修改Oracle RAC的_asm_hbeatiowait的方法
  4. 【计蒜客 - 2019南昌邀请赛网络赛 - H】Coloring Game(找规律,思维dp)
  5. 【UVA - 10020 】Minimal coverage (贪心,区间覆盖问题)
  6. python判断语句入门教程_Python中的条件判断语句基础学习教程
  7. 财物机器人英文ppt演讲课件_“如何恰当使用课件动画”
  8. File Io 删除类中的引用
  9. sam格式的结构和意义_各种格式的练字本,对写字真有帮助吗
  10. (十八)深入浅出TCPIP之epoll的一些思考