关于js的Set和Map结构的学习和记录

对阮一峰老师的ES6入门和网上有关资料的的一点学习和记录

1、Set数据结构

  • Set构造函数的参数是一个可遍历( iterator)对象
  • Set中的成员值是唯一的,判断成员是否相等用'==='来判断,不同之处在于,在Set中NaN与NaN判断为相等
  • Set的属性有.constructor:Set .size:成员大小
  • Set中有方法 .add(val):添加,返回set .delete(val):boolean删除 .has(val):boolean判断存在 .clear():清除所有成员
  • Set中的遍历方法 .keys():键名 .values():键值 .entries():键值对 .forEach(function(){}):回调函数
  • set.forEach(function(value,index,array){})中 value == index ==>set没有索引,不能用set[1]

*在set结构中没有键名,只有键值,所以set.keys() == set.values(),且默认遍历的是调用values()方法

以下是浏览器后台中Set结构的截图

实例中的代码:

<script>
var set = new Set([1,2,3,2,3]);
set.add('5');
set.add('5');
console.log(set);//Set(4) {1, 2, 3, "5"}
set.add(NaN);
console.log(set);//Set(5) {1, 2, 3, "5", NaN}
console.log(set.constructor);//ƒ Set() { [native code] }
console.log(set.size);//5
console.log(set.length);//报错
for(let i of set.keys()){//set结构类似数组遍历
console.log(i);{
}
}
for(let i of set.values()){ // ==for(let i of set)
console.log(i);
}
for(let i of set.entries()){ //键值对遍历
console.log(i);
}
</script>

2、Map数据结构

传统对象为键值对的集合,且键必须为'字符串',map结构改为'值-值'的形式,且可以用任何数据类型

map中的键根据内存地址来判断是否为同一个

  • Map构造函数的参数是一个可遍历( iterator)对象
  • Map也是键值对的存储形式,不过map中的键和值可以是任意的数据结构
  • Map的属性 .constructor:Map .size:成员大小
  • Map的方法 .set(key,value):设置值,返回map .get(key):获取值,返回value .has(key):判断存在,返回boolean
  • .delete(key):删除值,返回boolean .clear():清除成员
  • Map中的遍历方法 .keys():键名 .values():键值 .entries():键值对 .forEach(function(){}):回调函数

以下是在后台中Map结构的截图

实例代码

<script>
var map = new Map();
map.set(1,'123');//map.set(key,value)形式赋值
map.set('2',true);
map.set(false,'boolean');
console.log(map);//Map(3) {1 => "123", "2" => true, false => "boolean"}
console.log(map.size);//3
console.log(map.constructor);//Map()
for(let i of map.keys()){//键遍历
console.log(i);
}
for(let i of map.values()){//值遍历
console.log(i);
}
for(let i of map.entries()){//键值对遍历
console.log(i);
}
</script>

关于Set和Map数据结构的一点学习的更多相关文章

  1. ES6学习笔记(九)Set和Map数据结构

    1.set 基本等于Java的Set集合类型,无序不可重复集,常被用来去重. 基本用法 const s = new Set();//通过Set()构造函数创建 [2, 3, 5, 4, 5, 2, 2 ...

  2. ES6学习总结之Set和Map数据结构的理解

    前言 当我们需要存储一些数据的时候,首先想到的是定义一个变量用来存储,之后我们可能学了数组,发现数组比变量可以存储更多的数据,接着可能有其它的存储数据的方法等等,然而我今天需要介绍的是在ES6中比较常 ...

  3. ES6中Map数据结构学习笔记

    很多东西就是要细细的品读然后做点读书笔记,心理才会踏实- Javascript对象本质上就是键值对的集合(Hash结构),但是键只能是字符串,这有一定的限制. 1234 var d = {}var e ...

  4. es6学习笔记-set和map数据结构

    ES6 提供了新的数据结构 Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. Set 本身是一个构造函数,用来生成 Set 数据结构. const s = new Set(); [2, 3 ...

  5. js-ES6学习笔记-Set和Map数据结构

    1.ES6 提供了新的数据结构 Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. Set 本身是一个构造函数,用来生成 Set 数据结构. 2.Set 函数可以接受一个数组(或类似数组的对 ...

  6. JavaScript(ES6)学习笔记-Set和Map数据结构(一)

    一.Set 1.ES6 提供了新的数据结构 Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. Set 本身是一个构造函数,用来生成 Set 数据结构. , , , , ']); s; // ...

  7. ES6-Set和Map数据结构学习笔记

    Set和Map数据结构 Set 基本用法 ES6提供了新的数据结构--Set,类似于数组,但是成员的值是唯一的,没有重复的值,Set本身是一种构造函数,用来生成Set数据结构 var s = new ...

  8. ES6学习笔记(10)----Set和Map数据结构

    参考书<ECMAScript 6入门>http://es6.ruanyifeng.com/ Set和Map数据结构 1.Set  基本用法    Set是一种新的数据结构,它的成员都是唯一 ...

  9. es6 学习7 Set 和 Map 数据结构

     Set 和 Map 数据结构 一.Set ES6 提供了新的数据结构 Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. const set = new Set([1, 2, 3, 4, ...

随机推荐

  1. node.js操作数据库之MongoDB+mongoose篇

    前言 node.js的出现,使得用前端语法(javascript)开发后台服务成为可能,越来越多的前端因此因此接触后端,甚至转向全栈发展.后端开发少不了数据库的操作.MongoDB是一个基于分布式文件 ...

  2. jmeter从获取token开始设计接口

    用自己实习时候的一个项目来实现一下获取token的接口测试 以登录dmp的学科列表为例子: 从登录开始,打开开发者选项 点击登录 在开发者窗口中network xhr Fildder中,看登录时的请求 ...

  3. 你不可错过的Java学习资源清单

    学习Java和其他技术的资源其实非常多,但是我们需要取其精华去其糟粕,选择那些最好的,最适合我们的,同时也要由浅入深,先易后难.基于这样的一个标准,我在这里为大家提供一份Java的学习资源清单. Ja ...

  4. [Mathematics][MIT 18.02]Detailed discussions about 2-D and 3-D integral and their connections

    Since it is just a sort of discussion, I will just give the formula and condition without proving th ...

  5. [Luogu1379]八数码难题

    题目描述 在3×3的棋盘上,摆有八个棋子,每个棋子上标有1至8的某一数字.棋盘中留有一个空格,空格用0来表示.空格周围的棋子可以移到空格中.要求解的问题是:给出一种初始布局(初始状态)和目标布局(为了 ...

  6. [Luogu4447] [AHOI2018初中组]分组

    题目描述 小可可的学校信息组总共有n 个队员,每个人都有一个实力值a[i]a[i]a[i].现在,一年一度的编程大赛就要到了,小可可的学校获得了若干个参赛名额,教练决定把学校信息组的nnn 个队员分成 ...

  7. swoole与php协程实现异步非阻塞IO开发

    “协程可以在遇到阻塞的时候中断主动让渡资源,调度程序选择其他的协程运行.从而实现非阻塞IO” 然而php是不支持原生协程的,遇到阻塞时如不交由异步进程来执行是没有任何意义的,代码还是同步执行的,如下所 ...

  8. halcon学习方法小结及以后的学习计划

    学了这么久的halcon,感觉还是没有摸到门路. 记录一下这么久以来经历过的学习阶段: 看冈萨雷斯<数字图像处理>这本书,使用halcon做练习. 我实际上只比较完整地看了这本书的形态学处 ...

  9. prefer-object-spread

    eslint报错: Use an object spread instead of `Object.assign` eg: `{ ...foo }`.(prefer-object-spread) 即: ...

  10. java编写基于netty的RPC框架

    一 简单概念 RPC:(Remote Procedure Call),远程调用过程,是通过网络调用远程计算机的进程中某个方法,从而获取到想要的数据,过程如同调用本地的方法一样. 阻塞IO:当阻塞I/O ...