JS数组遍历中for,for in,for of,map,forEach各自的使用方法与优缺点
投稿:wdc
这篇文章主要介绍了JS数组遍历中for,for in,for of,map,forEach各自的使用方法与优缺点,需要的朋友可以参考下
JS数组遍历普通函数
优点:支持流程控制(break、continue、return)
for
const arr = ["A", "B", "C"] for(let i = 0; i<arr.length; i++){ console.log(arr[i]) }
优点:能够对索引精确控制
缺点:语法较为繁琐
for in
const arr = ["A","B","C"] arr["3"] = 1 Array.prototype["cc"] = "ck" for(let e in arr){ console.log(arr[e]) }
缺点:
1.遍历索引为字符串,即e类型为字符串
2.会遍历可枚举的非数字类型键以及原型上的键
3.不同浏览器对for in 顺序实现可能不一致
for of
const arr = ["A","B","C"] arr["3"] = 1 Array.prototype["cc"] = "ck" for(let i of arr){ console.log(i) }
优点:语法简洁、有序遍历
缺点:由于遍历的是值,对索引无直接控制
函数式编程-->高阶函数
缺点,不能进行流程控制
map
const arr = ["A","B","C"] arr.map(e => console.log(e))
优点:语法简洁,返回一个旧数组的映射数组,不影响原数组
forEach
const arr = ["A","B","C"] arr.forEach(e => console.log(e))
优点:语法简洁,在不需要返回数组时,性能较好比map好
名称 | 流程控制 | 函数式 |
---|---|---|
for | T | |
for of | T | |
forEach | T | |
map | T |
JS数组遍历函数总结:
在不需要流程控制时,优先使用map,不需要返回值使用forEach,需要索引的控制时,可以回退至for,for of一般结合内置默认迭代器的数据结构(Map、Set)使用,在需要结合生成器 async await 异步迭代时的选择
更多关于JS数组遍历方法的技巧请查看下面的相关链接
您可能感兴趣的文章:
- JS中for,for...in,for...of和forEach的区别和用法实例
- js中forEach,for in,for of循环的用法示例小结
- js遍历详解(forEach, map, for, for...in, for...of)
- 浅析JS中的 map, filter, some, every, forEach, for in, for of 用法总结
- 全面解析JavaScript里的循环方法之forEach,for-in,for-of
- JS中的forEach、$.each、map方法推荐
- JS中Map和ForEach的区别
- js中的for如何实现foreach中的遍历
- JavaScript forEach()遍历函数使用及介绍
- JS forEach跳出循环2种实现方法
- javascript forEach通用循环遍历方法
- JS 中forEach,for in、for of用法实例总结