javascript(基础)_对数组的遍历方法总结（find, findIndex, forEach,）
一、前言
这篇文章主要对JS中数组遍历的方法做一个总结：
1、find() findIndex()
2、forEach
3、every
4、map
5、reduce
二、主要内容
1、find()、findIndex()
用法：用于找出第一个符合条件的数组成员，他的参数是一个回调函数，会遍历所有元素，执行你给定的带有条件返回值的函数，如果满足了你给的条件函数，就返回第一个符合的元素，找不到返回undefined。
下面封装这个find()函数：
//要遍历的数组 var users = [ {id : 1, name: '张三'}, {id : 2, name: '张三'}, {id : 3, name: '张三'}, {id : 4, name: '张三'}, {id : 5, name: '张三'}, ] //在原型上定义一个方法，给他一个参数，这个参数的类型是一个函数 Array.prototype.myFind = function(conditionFun){ //谁调用这个方法this就是谁 for(var i=0; i< this.length; i++){ //如果满足了传过来的那个条件函数，就返回当前的元素 if(conditionFun(this[i], i)){ return this[i] } } } //用数组调用 var ret = users.myFind(function (item, index) { return item.id === 2 }) console.log(ret)
2、forEach()
用法： foreach()函数会将数组从头到尾遍历一遍，可以在回调函数中传三个参数，
var data = [1,2,3,4,5]; //只传一个参数，item为数组元素 data.forEach(function (item){ console.log(item) }) //传两个参数，item为数组元素，index为元素下标 data.forEach(function (item, index){ console.log(`${item}=========${index}`) }) //传三个参数，item为数组元素，index为数组下标，arr为数组 data.forEach(function (item, index, arr){ console.log(`${item}=========${index}====${arr}`) })
3、every
用法：用于检测数组中所有的元素是否都符合指定条件，这个条件通过回调函数传递。如果数组中有一个元素不满足，则整个表达式返回false, 剩余的元素不再进行检查。如果所有元素都满足，则返回true
用法如下：
function isBigEnough(element, index, array) { return (element >= 10); } var passed1 = [12, 5, 8, 130, 44].every(isBigEnough); // passed1 is false console.log(passed1) var passed2 = [12, 54, 18, 130, 44].every(isBigEnough); // passed2 is true console.log(passed2)
4、some
用法：与every()的用法恰巧有点相反。some()方法用于检测数组中的元素是否满足指定条件，该条件由函数提供，会一次执行数组中的每一个元素，如果有一个满足条件，整个表达式为true,剩余元素不在检测。如果没有满足条件的，则返回false
用法如下：
function isBigEnough(element, index, array) { return (element >= 10); } var passed1 = [2, 5, 8, 6, 9].some(isBigEnough); // passed1 is false console.log(passed1) var passed2 = [12, 54, 18, 130, 44].some(isBigEnough); // passed2 is true console.log(passed2)
5、include()
用法：函数用来判断是否包含指定的值，包含返回true,不包含返回false
例子：
let site = ['runoob', 'google', 'taobao']; site.includes('runoob'); // true site.includes('baidu'); // false
6、map
用法：map称为映射，也是键值对集合，键不仅仅是字符串还可以是其他类型，比如对象。map()的参数是一个回调函数，会根据回调函数映射成一个新的数组
方法一：
var data = [1,2,3,4] var data2 = data.map(function (item) { return item*item //这相当于将原来数组元素变成了它的平方 //item*item 一定要给回调函数返回值，如果没有会默认返回undefined }); console.log(data2)
用法二：map()回调中第一个参数为对象，我们可以直接拿到对象里面的某个属性
var users = [ {name: "张三", "email": "zhang@email.com"}, {name: "小王", "email": "wang@email.com"}, {name: "小红", "email": "hong@email.com"} ]; var emails = users.map(function (user) { return user.email; }); console.log(emails.join(", ")); // zhang@email.com, jiang@email.com, li@email.com
7、filter
用法：filter为筛选。filter() 的参数是一个过滤条件，这个条件是回调函数
var arr = [1, 2, 3, 4] arr=arr.filter(function (item) { return item%2 //这里过滤掉了偶数，只留下奇数 }) console.log(arr) arr = [1, 2]
用法二：获得以zhang开头的邮件
var users = [
{name: "张三", "email": "zhang@email.com"},
{name: "小王", "email": "wang@email.com"},
{name: "小红", "email": "hong@email.com"}
];
var emailsZhang = users // 获得邮件 .map(function (user) { return user.email; }) // 筛选出zhang开头的邮件 .filter(function(email) { return /^zhang/.test(email); }); console.log(emailsZhang);
8、reduce() 函数可以理解为进去一堆，出来的是一个，参数接受的是一个回调函数
arr.reduce(function(prev,cur,index,arr){
...
}, init);
arr 表示将要原数组；
prev 表示上一次调用回调时的返回值，或者初始值 init;
cur 表示当前正在处理的数组元素；
index 表示当前正在处理的数组元素的索引，若提供 init 值，则索引为0，否则索引为1；
init 表示初始值。
var arr = [1, 2, 3, 4, 5] var sum = arr.reduce(function (prev, cur) { return prev + cur; },0); //这里传入的初值为0,第一次计算0+1=1，的值作为下一轮的prev的值 1+2=3 继续作为下一轮的orev值
reduce()方法参考：https://www.jianshu.com/p/541b84c9df90
三、总结
