目录
总结
一、常规方法
for的4种写法
while
二、ES6方法
for...of,得到每项元素
for...in,得到的是数组索引
三、数组实例上的遍历方法
forEach(),得到每一项元素
map()
filter(),筛选一个数组
some(),数组某项满足条件
every (),数组每项都满足条件
总结
不需要保留原数组,不需要中断循环,使用forEach代替常规for需要保留原数组并使用逻辑处理后的新数组时用map遍历对象时,使用for..of+Object.keys(),尽量不使用for..in根据业务场景选择使用filter、some、every等一、常规方法
for的4种写法
let tmp_array = [1,2,3,4,5,6,7]// 方法一 数组长度是会动态变化,每次循环会重新计算length长度,可能会出现死循环for (let i = 0; i < tmp_array.length; i++) {console.log(tmp_array[i])}// 方法二 缓存length 值,无需重新计算lengthfor (let i = 0, len = tmp_array.length; i < len; i++) {console.log(tmp_array[i])}// 方法三 倒序for (let i = tmp_array.length-1; i >= 0; i--){console.log(tmp_array[i])}//倒序简洁版本//两个分号之间的表达式为 true 会一直执行,直到判断为 false (i = 0)for (let i = tmp_array.length-1; i--;){arr1.push(arr[i])}// 方法四for (let i = 0, tmp; tmp = tmp_array[i]; i++) {console.log(tmp)}
4种写法在时间和内存消耗是上无大差别,常用方法一、二。
while
时间和内存消耗与常规for无区别,数组遍历较少使用。
二、ES6方法
for...of,得到每项元素
let array = [1,2,3,4,5,6,7];for(let ele of array) {console.log(ele);};//字符串也可以使用for...of遍历let str = "helloabc";for(let ele of str) {console.log(ele);}//对象不可以使用let table = {a : 10,b : true,c : "jadeshu"};for(let item of table) {console.log(item); //table is not iterable}
可以遍历任何可迭代对象,如数组、字符串、Map、Set、DOM collection等,可以使用 break,continue和return 终止循环 ,内存占用少。
对象使用for...of
//通过Object.keys遍历for (let key of Object.keys(table)) {console.log(key + ": " + table[key]);}
for...in,得到的是数组索引
var array = [1,2,3,4,5,6,7];for(let index in array) {console.log(index,array[index]);};//也可以对enumerable对象操作!得到的是每项的索引keyvar table = {a : 10,b : true,c : "jadeshu"};for(let index in table) {console.log(index, table[index]);}
一般用于遍历对象,会将本身属性和原型链上的属性(除系统内置属性)全部遍历出来即便是不可枚举属性(enumerable:false), 可以通过items.hasOwnProperty
来遍历本身属性,由于查询到自己的原型链上,所以性能方面比较差 ,占用内存高。
三、数组实例上的遍历方法
forEach(),得到每一项元素
不会返回新的数组,常用于遍历数组,不能中断循环(使用break或return语句)。
我在工作中需要遍历对象数组并在某条件满足时改变每项值时使用,写法更优雅。
var array = [1,2,3,4,5,6,7];array.forEach(item => {console.log(item);});
map()
返回一个新数组,不能中断循环
由于有返回值,无需额外调用新数组的push方法,所以在执行浅拷贝任务上,内存占用很低
常用于需要对原数组进行逻辑处理并根据处理逻辑获取一个新数组。
let array = [1,2,3,4,5,6,7]let copyArr = array.map(function(value){return value+10})console.log(copyArr)
filter(),筛选一个数组
返回一个新数组,不改变原数组,不对空数组检测
var arr = ['A', '', 'B', null, undefined, 'C', ' '];var r = arr.filter(function (s) {return s && s.trim(); });r; // ['A', 'B', 'C']
some(),数组某项满足条件
返回true/false,不改变原数组,不对空数组检测
var arr = ['', 'pear', 'orange'];let tmp = arr.some(function (s) {return s.length > 0;})console.log(tmp); // true, 因为有个元素满足s.length>0
every (),数组每项都满足条件
返回true/false,不改变原数组,不对空数组检测
var arr = ['Apple', 'pear', 'orange'];let tmp = arr.every(function (s) {return s.length > 0;})console.log(tmp); // true, 因为每个元素都满足s.length>0