for
for循环是JS里最简单也是最通用的遍历方式,我们需要知道遍历的次数
。
for循环里return,break等关键字都是可以用的
let arr=[1,2,3,4,5];
for (let i = 0; i < arr.length; i ) {
console.log(i ':' arr[i]) //0:1 1:2 2:3 ...
}
for in
for…in 是es5标准, 此方法遍历数组效率比较低,它的作用主要是去遍历对象的可枚举属性。遍历的key,key为string类型,也会循环原型链中的属性,适用于对象。我们可以简单的认为,for...in是为遍历对象而设计的,不适合遍历数组。
遍历数组的缺点:数组的下标index值是数字,for-in遍历的index值"0","1","2"等是字符串
var person = {fname:"John", lname:"Doe", age:25};
var text = "";
var x;
for (x in person) {
text = person[x] " ";
}
//John Doe 25
for of
for…of是ES6的标准,该方法遍历的是可迭代对象(包括 Array
,Map
,Set
,String
,TypedArray
,arguments
对象等等)的属性所对应的值(value:键值)。所以它用来遍历数组时得到每个元素的值。
var arr = [
{id:1,value:'A'},
{id:2,value:'B'},
{id:3,value:'C'}
]
var str ='Hello'
for(let item of str){
console.log(item) //H e l l o
}
for(let item of arr){
console.log(item) //{id:1,value:'A'},{id:2,value:'B'},{id:3,value:'C'}
}
forEach
array.forEach(function(currentValue, index, arr), thisValue)
forEach() 方法用于调用数组的每个元素,并将元素传递给回调函数,是最节省内存的一种,但是不能break,也不能return
。注意: forEach() 只适用于数组,且对于空数组是不会执行回调函数的
var arr = [
{id:1,value:'A'},
{id:2,value:'B'},
{id:3,value:'C'}
]
arr.forEach(function(v,key,arr){
console.log(v,key,arr)
})
map
array.map(function(currentValue,index,arr), thisValue)
map方法将数组的所有成员依次传入参数函数,然后把每一次的执行结果组成一个新数组返回,即可以return
。注意:map仅适用于数组
var arr = [
{id:1,value:'A'},
{id:2,value:'B'},
{id:3,value:'C'}
]
var res = arr.map(function (item,index,ary ) {
return item.value='D';
})
console.log(res);// ["D", "D", "D"]; 原数组拷贝了一份,并进行了修改
console.log(arr);// [ {id: 1, value: "A"},{id: 2, value: "B"},{id: 3, value: "C"}]; 原数组并未发生变化
filter
Array.filter(function(currentValue, indedx, arr), thisValue) filter用于对数组进行过滤。创建一个新数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。
代码语言:javascript复制let nums = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let res = nums.filter((num) => {
return num > 5;
});
console.log(res); // [6, 7, 8, 9, 10]
reduce
array.reduce((total,currentValue,currentIndex,arr),initialValue)
接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。reduce() 对于空数组是不会执行回调函数的。
[0, 1, 2, 3, 4].reduce(function(previousValue, currentValue, index, array){
return previousValue currentValue;
});
//10
keys,values,entries
ES6 提供三个新的方法 —— entries(),keys()和values() —— 用于遍历数组。它们都返回一个遍历器对象
,可以用for...of
循环进行遍历,唯一的区别是keys()是对键名的遍历、values()是对键值的遍历,entries()是对键值对的遍历
var arr= [
{id:1,value:'A'},
{id:2,value:'B'},
{id:3,value:'C'},
]
for (let index of arr.keys()) {
console.log(index);
}
// 0
// 1
// 2
for (let elem of arr.values()) {
console.log(elem);
}
// {id: 1, value: "A"}
// {id: 2, value: "B"}
// {id: 3, value: "C"}
for (let [index, elem] of arr.entries()) {
console.log(index, elem);
}
//0 {id: 1, value: "A"}
//1 {id:2,value:'B'}
//2 {id:3,value:'C'}
every/some
返回一个布尔值。当我们需要判定数组中的元素是否满足某些条件时,可以使用every/some。这两个的区别是,every会去判断判断数组中的每一项,而some则是当某一项满足条件时返回。
代码语言:javascript复制let foo=[5,1,3,7,4].every(function (item,index) {
console.log(`索引:${index},数值:${item}`)
return item>2
})
console.log(foo)
代码语言:javascript复制let foo=[5,1,3,7,4].some(function (item,index) {
console.log(`索引:${index},数值:${item}`)
return item>2
})
console.log(foo)