JavaScript中常见批量处理数组元素的方法
在我们实际编写JavaScript代码的时候，我们经常需要处理一堆堆的数据，他可能是一个数组，一个json，一个object。
而我今天就就讲一下如何对一个数组中的元素执行批量处理。
情景假设
某个企业网站上展示了公司人员列表，每个人员都至少包含了姓名，性别，年龄，岗位等信息，现在有个需求要给这个列表增加一个编辑功能。我的做法是，员工信息统一用一个数组维护，每个人的信息都是这个数组的成员。编辑人的信息就是编辑这个数组的信息，然后刷新人员列表。这样比较容易操作，加载和保存人员信息也比较好做。
人员数组：
var userList = [{name:"张三",age:25,six:"男"},{name:"李四",age:32,six:"男"},{name:"王五",age:21,six:"男"},{name:"张磊",age:28,six:"男"}];
需求：罗列用户
现在需要写个方法，罗列所有的人员姓名，保存到一个数组。
一般我们会这么写：
var nameList=[];
$(userList).each(function(){
nameList.push(this.name);
});
我们使用jquery的each方法手动遍历数组。并取出每个成员的name保存到一个临时变量里面。
Map方法实现
而现在有个更简单的方法就是jquery的map方法。
map方法的原形:
$.map(object,callback) .map(callback(index,item))
object:需要遍历的对象
callback:处理每个成员的回调处理方法，返回处理结果
对object中的每个成员调用callback处理，callback又会返回处理结果，map最终会整合这些处理结果并返回。
$(userList).map((index,user)=>user.name);
map配合箭头函数的写法，代码是不是很简单？
需求：用户查询
现在来个进阶的，现在这个用户列表需要有个搜索功能，比如按年龄搜索，排除大于某个年龄的人员。
$(userList).map((index,user)=>{if(user.age<22) {return user.name} else{ return null}});
reduce方法
接下来讲一下更牛逼的reduce方法
reduce原型
[].reduce(callbackfn(preValue,curValue,index,array)[, initialValue])
这是一个JavaScript原生方法。接受2个参数，第一个是回调方法，第二个是可选的初始值回调方法包含了四个参数，
preValue: 上一次调用回调返回的值，或者是提供的初始值（initialValue）
curValue: 数组中当前被处理的数组项
index: 当前数组项在数组中的索引值
array: 调用 reduce()方法的数组
reduce方法相比map方法，可自定义对遍历的数组成员进行组合，而不是map中直接变成一个jquery的数组对象。
var arr = [3, 4, 5, 6];
Array.prototype.sum = function () {
var sumResult = 0;
return this.reduce(function (preValue, curValue) {
return sumResult = preValue + curValue;
});
}
arr.sum();
上述代码给数组原形添加了一个sum方法，利用reduce方法，对数组的每一个成员执行了求和计算。preValue是之前值累加的结果，curValue是当前需要处理的数组成员。
当前这里还提一下reduceRight这个方法，这个方法的使用方法和reduce是一样的，只是reduceRight是从数组的末尾开始遍历的。
var arr = [4, 5, 6];
Array.prototype.ruduceRightSum = function () {
for (var i = 0; i < 10000; i++) {
return this.reduceRight(function (preValue, curValue) {
return preValue + curValue;
});
}
}
arr.ruduceRightSum();
补充内容
新需求，我需要查询所有用户中，包含“张”这个字的所有人的完整信息。
这个需求不同于之前的情况（并不需要修改元素），只需要对数组做过滤。
[].filter(Fn(element, index, array))
数组的filter方法可以通过Fn对每个成员执行过滤处理，Fn返回true保留这个成员，返回false丢弃。
当然你也可以不用单独声明这个回调函数而改用箭头函数。
此方法一般用于筛选数据中的元素。
function SearchByName(element, index, array) {
return (element.name.indexOf("张")!=-1);
}
userList.filter(SearchByName);
userList.filter((element)=>element.name.indexOf("张")!=-1);
新需求，人员信息添加工资字段，每个人的初始工资都是6K。
userList.forEach((user)=>user.wage=6000);
[].forEach(Fn) 用于循环遍历一个数组，传递每一个元素给回调函数Fn，Fn有三个参数，第一个是具体的元素，第二个是索引，第三个是正在处理的数组。
此方法一般用于批量处理数组的元素。
