1.forEach

遍历数组,参数为一个回调函数,回调函数有三个参数:当前元素,元素索引,整个数组;无返回值

let data = [1,3,5,7,9,11,13];
let result = data.forEach((item)=>{
console.log('item = '+(item+1));
return item + 1;//无效
});
//result is undefined
data.forEach((item,index,arr)=>{
console.log(`item = ${item} ,index = ${index}`);
arr[index] = item + 1;
});
//data : [2, 4, 6, 8, 10, 12, 14]

2.map

与forEach类似,遍历数组,回调函数返回值组成一个新数组返回,新数组索引结构和原数组一致,原数组不变

let data = [1,3,5,7,9,11,13];
let result = data.map((item)=>{
console.log('item = '+(item+1));
return item + 1;
});
// data: [1,3,5,7,9,11,13]
// result: [2, 4, 6, 8, 10, 12, 14]
result = data.map((item,index,arr)=>{
return `i ${item}${index}`+arr.length;
});
//result:["i 107", "i 317", "i 527", "i 737", "i 947", "i 1157", "i 1367"]

3.filter

返回数组的一个子集,回调函数用于逻辑判断是否返回,返回true则把当前元素加入到返回数组中,false则不加,新数组只包含返回true的值,索引缺失的不包括,原数组保持不变

let data = [1,2,3,4,5,6,7,8,9];
let result = data.filter((item)=>{
console.log('item = '+(item+1));
return item%2 == 1;
});
// data: [1,2,3,4,5,6,7,8,9];
// result:[1, 3, 5, 7, 9]
result = data.filter((item,index,arr)=>{
return index > 4;
});
//result:[6, 7, 8, 9]

4.find

返回第一个符合条件的值,当数组中的元素在测试条件时返回 true 时, find() 返回符合条件的元素,之后的值不会再调用执行函数;如果没有符合条件的元素返回 undefined

let data = [1,3,5,7,9,11,13];
let result = data.find((item,index,arr)=>{
return item > 5 && index > 4;
});
//result = 11

5.every

every是“所有”函数的每个回调函数都返回true的时候才会返回true,当遇到false的时候终止执行,返回false;

let data = [1,3,5,7,9,11,13];
let result = data.every((item,index,arr)=>{
return item % 2 == 1;
});
//result = true

6.some

some函数是“存在”有一个回调函数返回true的时候终止执行并返回true,否则返回false。

let data = [1,3,5,7,9,11,13];
let result = data.every((item,index,arr)=>{
return item % 2 == 0;
});
//result = false

示例:链式调用示例:

  • 原始数据
{
"date":"20190906",
"stories":[
{
"image_hue":"0x615d5a",
"title":"孩子常会跟幼儿园里骂他的同学打架,怎么教他赢回小孩子的尊严?",
"url":"https://daily.zhihu.com/story/9714935",
"hint":"Cecilia · 3 分钟阅读",
"ga_prefix":"090620",
"images":[
"https://pic3.zhimg.com/v2-d1726350b67e8d40400bf06ecd88d54a.jpg"
],
"type":0,
"id":9714935
}
]
}
  • 输出含有图片的item,并只获取其中的
fetch('https://news-at.zhihu.com/api/4/news/before/20190907')
.then((res) => res.json())
.then((res) => {
let json = JSON.parse(JSON.stringify(res));
const repos = json.stories.filter((item,index,arr) => {
return item.images && item.images.length>0;
}).map((item,index,arr) => {
const r = {};
r.image = item.images[0];
r.title = item.title;
r.url = item.url;
r.type = 'image';
r.index = index;
return r;
});
console.log(JSON.stringify(repos))
});
  • 返回示例:
[
{
"image":"https://pic3.zhimg.com/v2-d1726350b67e8d40400bf06ecd88d54a.jpg",
"title":"孩子常会跟幼儿园里骂他的同学打架,怎么教他赢回小孩子的尊严?",
"url":"https://daily.zhihu.com/story/9714935",
"type":"image",
"index":0
}
]