一痛黎,ES5中常用數(shù)組遍歷方式:
首先定義一個(gè)數(shù)組
let arr = [7,9,12,16,3,20,8,5,6]
1.for 循環(huán)
for(let i = 0;i<arr.length;i++){
console.log(arr[i])
}
2.forEach()遍歷
arr.forEach((item=>{
console.log(item)
}))
注意:forEach只做循環(huán)遍歷狸相,不做值返回
3.map()遍歷桩匪,返回新的數(shù)組怕篷,數(shù)組中的每一個(gè)元素為調(diào)用func的結(jié)果历筝,不對(duì)原數(shù)組做修改
let result = arr.map(item=>item+1)
console.log(result) // [8, 10, 13, 17, 4, 21, 9, 6, 7]
4.filter() 根據(jù)函數(shù)設(shè)定的條件過(guò)濾,返回符合func條件的元素
let result = arr.filter(item=>item%2 ==0)
console.log(result) // [12, 16, 20, 8, 6]
5.reduce(Fn(prev,cur,index,arr)=>{},value) 接收一個(gè)函數(shù)做累加器, 并傳入一個(gè)初始值
例1廊谓,求和
let sum = arr.reduce((prev,cur)=>{
return prev+cur
},0)
console.log(sum) //86
例2 梳猪,獲取數(shù)組中最大值
let sum = arr.reduce((prev,cur)=>{
return Math.max(prev,cur)
},0)
console.log(sum) //20
例3,數(shù)組去重
let arr1 = [1,2,3,4,2,1]
let sum = arr1.reduce((prev, cur) => {
prev.indexOf(cur) == -1 && prev.push(cur)
return prev
}, [ ])
console.log(sum) // [1, 2, 3, 4]
5.some()返回布爾值蒸痹,判斷是否有元素符合func條件
let result = arr.some(item=>item==12)
console.log(result) // true
6.every()返回布爾值春弥,判斷是否每一個(gè)元素都符合func條件
let result = arr.some(item=>item==12)
console.log(result) // false
7.for in (存在問(wèn)題)
Array.prototype.foo = function(){
console.log('foo')
}
for(let i in arr){
console.log(arr[i]) //7 9 12 16 3 20 8 5 6 f (){ console.log('foo') }
]
}
注意:for in ,在Array的原型中添加一個(gè)func叠荠,此時(shí)再循環(huán)數(shù)組匿沛,原型下的方法,將被遍歷出來(lái)
二榛鼎,ES6中新增數(shù)組遍歷方式:
首先定義一個(gè)數(shù)組
let arr = [1,2,3,4,5,6,2,3]
1.find() 遍歷數(shù)組并找到數(shù)組中第一個(gè)與返回符合條件的值
let res = arr.find(item=>item==2)
console.log(res) //2
2.findIndex() 遍歷數(shù)組并找到數(shù)組中第一個(gè)與返回符合條件的值的下標(biāo)
let res = arr.findIndex(item=>item==2)
console.log(res) // 1
3.for of 逃呼, values() keys() entries()
for(let item of arr){ //直接使用for of 等同于 values() 輸出每一個(gè)元素的值
console.log(item) // 1 2 3 4 5 6 2 3
}
1.values() 輸出每一個(gè)元素的值
for(let item of arr.values()){
console.log(item) // 1 2 3 4 5 6 2 3
}
- keys() 輸出每一個(gè)元素的索引
for(let item of arr.keys()){
console.log(item) //0 1 2 3 4 5 6 7
}
3.entries() 輸出每一個(gè)元素的索引與值
for(let [index,item] of arr.entries()){ //.entries( 輸出每一個(gè)元素的索引與值
console.log('索引',index,‘值’,item)
}
//輸出結(jié)果:
// 索引 0 值 1
//索引 1 值 2
//索引 2 值 3
//索引 3 值 4
//索引 4 值 5
//索引 5 值 6
//索引 6 值 2
//索引 7 值 3