JS数组的几种遍历方法

JS数组的几种遍历方法

定义一个数组

var arr = ['apple','orange','banner','dpn','dulin']

1、for循环

for (var i = 0; i < arr.length; i++) {
	console.log(arr[i]);
}

循环的点就在于数组会一直调用这个函数，直到arr.length为0没有currentValue值的时候

• currentValue：当前遍历到的元素的值
• index：当前遍历到的元素的索引
• arr：原数组

2、forEach循环

没有返回值
如果循环很复杂的时候，for循环效率更高

arr.forEach((currentValue,index, arr) => {
	console.log(currentValue + '------' + index);
	console.log(arr);
})

3、filter

返回一个新的数组
通过筛选 return 满足筛选条件的数据，然后把所有满足条件的元素放进新的数组

var newarr = arr.filter((currentValue,index, arr) => {

//返回元素第一个元素为 ‘d’的元素
	return currentValue.charAt(0) === 'd'
})
console.log(newarr);

4、map

类似于forEach
但是有返回值，return的是啥返回的新数组就是什么
不返回，默认是一个undefined元素的数组

arr.map((currentValue,index, arr) => {
	console.log(currentValue + '------' + index);
	console.log(arr);
	return currentValue
})

return的新数组的内容

5、some

主要检测数组中的元素是否满足条件
返回一个布尔值，只返回一个满足条件的元素
【如果找到第一个满足条件的元素，则终止循环】

var flag =  arr.some((currentValue,index, arr) => {
	return currentValue.charAt(0) === 'a'
})
console.log(flag);

遍历的时候检测到第一个元素的首字母是‘a’，返回true

6、every

类似于some
但是some是遇到有满足条件的返回true
但是every是要求全部满足条件才返回true

var flag = arr.every((currentValue,index, arr) => {
	return currentValue.charAt(0) === 'a'
})
console.log(flag);

遍历的时候，检测到不是所有的元素首字母是‘a’，所以返回false

7、reduce()

返回的数据类型根据 return 后面的数据类型决定

var arr1 = arr.reduce((previousValue, currentValue, index, arr) => {
	console.log(previousValue);
	console.log(currentValue +'-----'+ index);
	return currentValue == 'apple'
	return arr
	return currentValue + previousValue
},[])

previousValue：上次返回回来的值
currentValue： 当前元素值
index：当前元素索引值
arr：原数组

如果再reduce()的第二个参数没有设置数据类型
那么默认就会把数组的第一个元素作为previousValue的值

如果再reduce()的第二个参数设置了数据类型
那么第一次返回的previousValue值是空的，默认的数据类型就是第二个参数设置的数据类型，如上 是数组类型

• return后面的内容是一个【判断】，那就返回有一个布尔值，这个布尔值就是previousValue，每次都会更新return的值 ------------如上

• return后面是一个数组，就返回一个数组
  

• return一个字符串
  并且没有设置第二个参数，所以第一个previousValue的值默认是第一个元素的值—‘apple’
  

8、for of

for (var val of arr) {
	console.log(val);
}