es6之数组循环

一、回顾es5数组循环

1.arr.forEach()循环

可以接受两个参数：
arr.forEach(循环回调函数，this指向谁）

arr.forEach(function(){
	
},arr)

使用箭头函数(不能改变this指向了）

arr.forEach((val,index,arr)=>{
	//回调函数中可以接受3个参数， 1.value值 2.索引 3.整个数组
})

2.arr.map() ‘映射’

非常有用，可以重新整理数据结构

正常情况下，需要配合return，返回的是一个新的数组，如果没有return，相当于forEach（）
注意：如果使用map，一定要有返回值；

let arr = [
	{title:'a',read:100,hot:true},
	{title:'b',read:200,hot:false},
	{title:'c',read:300,hot:true}
]
let newArr = arr.map((val,index,arr)=>{
	let json = {}
	json.t = val.title
	json.r = val.read
	json.hot = val.hot == true && 'n'
	return json
})

console.log(newArr)
// [
		{t:'a',r:100,hot:'n'},
		{t:'c',r:300,hot:'n'}
	]

3.arr.filter() ‘过滤’

过滤一些不合格元素

let arr = [
	{title:'a',read:100,hot:true},
	{title:'b',read:200,hot:false},
	{title:'c',read:300,hot:true}
]

let newArr = arr.filter((val,index,arr)=>{
	return val.hot == true;
})

console.log(newArr)
// [
		{title:'a',read:100,hot:true},
		{title:'c',read:300,hot:true}
	]

4.arr.some()

类似查找，数组里某一个元素符合条件，返回true

let a = ['apple','banana','orange']
let b = arr.some((val,index,arr)=>{
	return val = 'banana';
})

console.log(b) // true

5.arr.every()

类似查找，数组中所有元素符合条件返回true

判断数组中所有元素是否都是奇数

let arr = [1,3,5,7,9]
let b = arr.every((val,index,arr)=>{
	return val%2 ==1;
})

console.log(b) //true

6.arr.reduce() //循环从左往右

接受参数：

1. 上一个元素
2. 当前元素
3. 当前索引
4. 整个数组

数组求和

let arr = [1,2,3,4,5,6,7,8,9,10]
let b = arr.reduce((prev,cur,index,arr)=>{
	return prev + cur;
})

console.log(b) // 55

7.arr.reduceRight() //循环从右往左

用法同 arr.reduce()

二、es6新增循环

for…of…循环

let arr = ['apple','banana','orange']
for(let val of arr){
	console.log(val) // apple banana orange
}

循环索引：

for(let index of arr.keys()){
	console.log(index) //0,1,2
}

既循环值又循环索引：

for(let item of arr.entries()){
	console.log(item)
	// [0,'apple'],[1,'banana'],[2,'orange']
}

arr.keys() //数组下标
arr.entries() //数组某一项

查看其它ES6知识点

前端进阶精选：点此去