ES6数组新增方法forEach、map、filter、find、every、some、reduce的用法

*ES6语法，Opera 11+    Firefox 3.6+    Safari 5+    Chrome 8+ I   nternet Explorer 9+支持。可以通过babel转意支持低版本浏览器。

forEach()

ES6新增的一种循环

案例1打印数组中所有对象

[code]numbers=[1,2,3,4,5]
numbers.forEach(number => {
console.log(number)  //1 2 3 4 5
});

案例2将数组中所有数字相加（这里用了函数抽离的方式）

[code]numbers=[1,2,3,4,5]
var sum=0
function add(num){
sum+=num
}
numbers.forEach(add)
console.log(sum)    //15

map()

原数组被“映射”成对应新数组,返回一个新数组

案例1将原数组的每个数字都*2

[code]var numbers=[1,2,3,4,5]
var doublnumbers=numbers.map(number=>{
return number*2
})
console.log(doublnumbers)  //[2,4,6,8,10]

案例2将A对象数组中某个属性存到B数组中

[code]var building=[
{name:'the Great Wall',location:'BeiJing'},
{name:'Eiffel Tower',location:'Paris '}
]
var citys=building.map(item=>{
return item.location
})
console.log(citys)  //["BeiJing", "Paris "]

filter()

filter为“过滤”。数组filter后，返回过滤后的新数组

案例1假定有一个对象数组A,获取数组中指定类型的对象放到B数组中

[code]var products = [
{name:"cucumber",type:"vegetable"},
{name:"banana",type:"fruit"},
{name:"celery",type:"vegetable"},
{name:"orange",type:"fruit"}
];
var filtered = products.filter((product)=>{
return product.type === "vegetable";
})
console.log(filtered)  //[{name:"cucumber",type:"vegetable"},{name:"celery",type:"vegetable"}]

案例2假定有两个数组(A,B),根据A中id值,过滤掉B数组不等于A中id的数据

[code]var post = {id:4,title:"Javascript"};
var comments = [
{postId:4,content:"Angular4"},
{postId:2,content:"Vue.js"},
{postId:3,content:"Node.js"},
{postId:4,content:"React.js"}
];
function commentsForPost(post,comments){
return comments.filter(function(comment){
return comment.postId === post.id;
})
}

console.log(commentsForPost(post,comments));  //[ {postId:4,content:"Angular4"},{postId:4,content:"React.js"}]

find()

在数组中找到符合要求的对象 和filter的区别就是找到符合要求的对象就停止寻找了，返回的是一个对象，而filter返回的是所以符合要求的对象组成的新数组

案例1假定有一个对象数组(A),找到符合条件的对象

[code]var users = [
{name:"Jill",id:1},
{name:"Alex",id:2},
{name:"Bill",id:3},
{name:"Alex",id:4}
];
user = users.find(function(user){
return user.name === "Alex";
})
console.log(user); //{name: "Alex", id: 2}

案例2假定有两个数组(A,B),根据A中id值,找到B数组等于A中id的数据

[code]var post = {id:4,title:"Javascript"};
var comments = [
{postId:4,content:"Angular4"},
{postId:2,content:"Vue.js"},
{postId:3,content:"Node.js"},
{postId:4,content:"React.js"}
];
function commentsForPost(post,comments){
return comments.find(function(comment){
return comment.postId === post.id;
})
}

console.log(commentsForPost(post,comments));  // {postId:4,content:"Angular4"}

every()  some()

every 若目标数组中每一个对象都符合条件则返回true，否则返回false

some 若目标数组中有一个或一个以上的对象符合条件的返回true，否则返回false

案例

[code]var users = [
{name:"Jill",age:10},
{name:"Alex",age:18},
{name:"Bill",age:20},
{name:"Tony",age:24}
];

var isAdult_every=users.every(user=>{
return user.age>18;
})

var isAdult_some=users.some(user=>{
return user.age>18;
})

console.log(isAdult_every)  //false
console.log(isAdult_some)  //true

reduce()

常用于叠加，可以代替forEach等

案例计算数组中所有值的总和

[code]var numbers = [1,2,3,4,5];
var sumValue = numbers.reduce(function(sum,number2){  //第一个参数为叠加总值，需要初始化，第二个参数是当前项
return sum + number2;
},0);    //sum的初始化
console.log(sumValue);   //15