详谈js遍历集合(Array,Map,Set)
作者:jingxian 时间:2024-04-16 09:29:53
Array可以使用下标,Map和Set不能使用下标,ES6引入了iterable类型,Array,Map,Set都属于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]);
}
>for...of与for...in的区别:for ... in循环由于历史遗留问题,它遍历的实际上是对象的属性名称。一个Array数组实际上也是一个对象,它的每个元素的索引被视为一个属性。
当我们手动给Array对象添加了额外的属性后,for ... in循环将带来意想不到的意外效果:
var a = ['A', 'B', 'C'];
a.name = 'Hello';
for (var x in a) {
alert(x); // '0', '1', '2', 'name'
}
var a = ['A', 'B', 'C'];
a.name = 'Hello';
for (var x of a) {
alert(x); // 'A', 'B', 'C'
}
>更好的方式:iterable内置的forEach方法:
var a = ['A', 'B', 'C'];
a.forEach(function (element, index, array) {
// element: 指向当前元素的值
// index: 指向当前索引
// array: 指向Array对象本身
alert(element);//'A','B','C'
});
var s = new Set(['A', 'B', 'C']);
s.forEach(function (element, sameElement, set) {
alert("参数1="+element+",参数2="+sameElement);
});
//参数1=A,参数2=A
//参数1=B,参数2=B
//参数1=C,参数2=C
var m = new Map([[1, 'x'], [2, 'y'], [3, 'z']]);
m.forEach(function (value, key, map) {
alert("参数1="+value+",参数2="+key);
});
//参数1=x,参数2=1
//参数1=y,参数2=2
//参数1=z,参数2=3
标签:js,遍历,map,array,set
0
投稿
猜你喜欢
详解配置Django的Celery异步之路踩坑
2022-11-25 22:06:45
Django重装mysql后启动报错:No module named ‘MySQLdb’的解决方法
2023-02-01 07:31:31
Vue+Antv F2实现层叠柱状图
2023-07-02 16:54:55
Python读取环境变量的方法和自定义类分享
2022-11-13 23:47:08
讲解数据库管理系统必须提供的基本服务
2009-01-04 14:33:00
Linux下创建Postgresql数据库的方法步骤
2024-01-29 09:29:19
纯js封装的ajax功能函数与用法示例
2024-05-11 09:09:20
跟老齐学Python之再深点,更懂list
2021-02-05 21:44:18
Golang加密解密之RSA(附带php)
2024-05-08 10:21:28
Python的Django框架中settings文件的部署建议
2023-07-08 21:39:43
适合Python初学者的一些编程技巧
2022-01-14 11:19:09
php fread函数使用方法总结
2024-05-03 15:49:24
MySQL锁阻塞的深入分析
2024-01-20 12:47:22
Python面向对象程序设计类的封装与继承用法示例
2022-12-22 08:34:33
GitLab使用外部提供的Redis缓存数据库的方法详解
2024-01-23 10:02:57
Python 如何实现数据库表结构同步
2024-01-21 16:38:44
PHP封装的一个支持HTML、JS、PHP重定向的多功能跳转函数
2023-11-19 07:25:14
Python中安装easy_install的方法
2022-06-22 20:30:00
对Python中创建进程的两种方式以及进程池详解
2021-05-21 14:37:48
JS 设计模式之:单例模式定义与实现方法浅析
2024-04-29 14:10:04