JavaScript中的Map、Set及其遍历
Map
Map是一组键值对的结构,具有极快的查找速度。
Map的定义。
//空map设值key-value
var m = new Map();
m.set("XiaoMing",99);
m.set("XiaoHong",66);
//构造参数传key-value
var m = new Map([['XiaoMing', 99], ['XiaoHong', 66]]);
Map中的方法
var m = new Map(); // 空Map
m.set('XiaoMing', 99); // 添加新的key-value
m.has('XiaoMing'); // 是否存在key 'XiaoMing': true
m.get('XiaoMing'); //
m.delete('XiaoMing'); // 删除key 'XiaoMing'
m.get('XiaoMing'); // undefined
对一个key重复设值,后面的值会将前面的值覆盖。
var m = new Map();
m.set('XiaoMing', 99);
m.set('XiaoMing', 98);
m.get('XiaoMing'); //
Set
Set和Map类似,但set之存储key,且key不重复。
Set的创建。
var s1 = new Set(); // 空Set
s1.add(1);
s1.add(2);
s1.add(3); var s2 = new Set([1, 2, 3]); // 含1, 2, 3
插入重复的值,set会将重复的值进行过滤
var s = new Set([1, 2, 3]);
s.add(3);
>>s; // Set{1,2,3}
s.delete(3);
>>s; // Set([1,2]);
Map及Set的遍历
Array可以采用下标进行循环遍历,Map和Set就无法使用下标。为了统一集合类型,ES6标准引入了iterable类型,Array、Map、Set都属于iterable类型。
具有iterable类型的集合可以通过新的for ... of循环来遍历。
var a = ['A', 'B', 'C'];
var s = new Set(['A', 'B', 'C']);
var m = new Map([[1, 'x'], [2, 'y'], [3, 'z']]);
for (var x of a) { // 遍历Array
alert(x);
}
for (var x of s) { // 遍历Set
alert(x);
}
for (var x of m) { // 遍历Map
alert(x[0] + '=' + x[1]);
}
更好的遍历:forEach
forEach是iterable内置的方法,它接收一个函数,每次迭代就自动回调该函数。
var a = ['A', 'B', 'C'];
a.forEach(function (element, index, array) {
// element: 指向当前元素的值
// index: 指向当前索引
// array: 指向Array对象本身
alert(element);
});
Set与Array类似,但Set没有索引,因此回调函数的前两个参数都是元素本身:
var s = new Set(['A', 'B', 'C']);
s.forEach(function (element, sameElement, set) {
alert(element);
});
Map的回调函数参数依次为value、key和map本身:
var m = new Map([[1, 'x'], [2, 'y'], [3, 'z']]);
m.forEach(function (value, key, map) {
alert(value);
});
JavaScript中的Map、Set及其遍历的更多相关文章
- 由实现JavaScript中的Map想到的
项目中要用到JavaScript中的Map数据类型,它不像JDK那样有自带的,怎么办?搜了找到一个不错的(http://darkmasky.iteye.com/blog/454749).用这个可以满足 ...
- JavaScript 中的12种循环遍历方法
原文:JavaScript 中的12种循环遍历方法 题目:请介绍 JavaScript 中有哪些循环和遍历的方法,说说它们的应用场景和优缺点? 1.for 循环 let arr = [1,2,3];f ...
- ES6新特性:Javascript中的Map和WeakMap对象
Map对象 Map对象是一种有对应 键/值 对的对象, JS的Object也是 键/值 对的对象 : ES6中Map相对于Object对象有几个区别: 1:Object对象有原型, 也就是说他有默认的 ...
- JavaScript中的Map
1.首先,在新版本的浏览器中,已经实现了对Map的原生支持:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Glob ...
- JavaScript 中的 Map
很多编程语言中都有类似Map这种 键-值对 的数据结构. 可惜,JavaScript没有. 幸运的是,可以自己构建一个Map对象. 对象的定义 <script type="text/j ...
- JavaScript中的map方法
假设有一个函数f(x)=x²;作用在一个数组[1,2,3,4,5,6,7,8,9],通常我们会用遍历的方法来实现. function f(x){ return x * x; } var arr = [ ...
- JavaScript中数组map()方法
JavaScript 数组map()方法创建一个新的数组使用调用此数组中的每个元素上所提供的函数的结果.语法 ? 1 array.map(callback[, thisObject]); 下面是参数的 ...
- JavaScript中的Map和Set
JavaScript的默认对象表示方法{}可以视为其他语言中的Map或者Dictionary的数据结构,即一组键值对. 但是JavaScript的对象有个小问题,就是键必须是字符串,但实际上Numbe ...
- javascript中的12种循环遍历方法1
1:for循环 let arr = [1,2,3]; for(let i =0;i<arr.length;i++){ console.log(i,arr[i]) } //for循环是js中最常用 ...
随机推荐
- redis 中用正则找key
获取 redis 中所有的 key 可用使用 *. redis 127.0.0.1:6379> KEYS * 1) "w3c3" 2) "w3c1" 3) ...
- Java面试题系列(一)描述一下JVM加载class文件的原理机制
JVM系列第4讲:从源代码到机器码,发生了什么? https://www.cnblogs.com/chanshuyi/p/jvm_serial_04_from_source_code_to_machi ...
- H5 Day2 练习
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- PHP中GET和POST区别
1. get是从服务器上获取数据,post是向服务器传送数据.2. get是把参数数据队列加到提交表单的ACTION属性所指的URL中,值和表单内各个字段一一对应,在URL中可以看到.post是通过H ...
- Java使用WebSocket
网页端的消息推送,一般有以下方式: 轮询方式:客户端定时向服务端发送ajax请求,服务器接收到请求后马上返回消息并关闭连接. 优点:后端程序编写比较容易. 缺点:TCP的建立和关闭操作浪费时间和带宽, ...
- MongoDB 之 $关键字 及 $修改器 $set $inc $push $pull $pop MongoDB - 4
我们在之前的 MongoDB 之 手把手教你增删改查 MongoDB - 2 中提到过 $set 这个系统关键字,用来修改值的对吧 但是MongoDB中类似这样的关键字有很多, $lt $gt $lt ...
- G. (Zero XOR Subset)-less(线性基)
题目链接:http://codeforces.com/contest/1101/problem/G 题目大意:给你n个数,然后让你把这n个数分成尽可能多的集合,要求,每个集合的值看做这个集合所有元素的 ...
- order by 字段自动填写脚本
新版 firefox 中的 hackbar 没有 order by 字段填写, 所以就有了这个: =begin pod sql注入中自动输出order by 的位数 =end pod sub MAIN ...
- linux下常用FTP命令 上传下载文件【转】
1. 连接ftp服务器 格式:ftp [hostname| ip-address]a)在linux命令行下输入: ftp 192.168.1.1 b)服务器询问你用户名和密码,分别输入用户名和相应密码 ...
- Unity 网格 绘制
网格绘制主要用是对Mesh进行操作,通过对vertex和triangles进行操作生成对应的面片: 这里首先得用到一个类:Triangulator(根据vertex生成triangles数组) usi ...