JS数组filter和map函数3.数组⾼级扩展函数
ES6 针对 数组 提供了 很多⾼级筛选⽅法，此处介绍两个 常⽤的 ⽅法
3.1 filter筛选⽅法
作⽤：
根据条件筛选 出 原数组 中的元素，并添加到⼀个 新数组 中返回
不会改变原始数组，只是把符合条件的元素 添加到⼀个新数组中
参数：array.filter(回调函数( currentValue,index,arr ))
value - 当前元素值
index - 当前元素下标
arr - 当前数组
返回值：
返回包含符合条件的元素的数组
没有符合条件的元素，则返回 空数组。
本质：内部其实就是 对 数组做循环，并把原数组中符合条件的元素添加到新数组中返回例⼦：筛选 常量数组
//1.返回 list 数组中⼤于2的元素
let list =[1,2,3,4];
let list2 = list.filter((v, i)=>{
return v >2;
});
console.log(list2);// 输出: [ 3, 4 ]
例⼦：筛选 对象数组：
//2.返回 list3 中 age >22 的对象
let list3 =[
{ name:'j', age:12},
{ name:'a', age:22},
{ name:'m', age:32},
{ name:'e', age:42},
{ name:'s', age:52}
];
let list4 = list3.filter((v, i)=>{
return v.age >22;
});
console.log(list4);
/* 输出:
[
{ name: 'm', age: 32 },
{ name: 'e', age: 42 },
{ name: 's', age: 52 }
]
*/
扩展：⾃⼰模仿⼀个数组的 filter ⽅法，返回符合条件的元素组成的新数组
// 为数组原型添加⼀个 myfilter ⽅法
filter=function(fn){
let newArr =[];
// 遍历当前数组
for(let i =0; i <this.length; i++){
// 调⽤回调函数，传⼊当前元素，下标，原数组本⾝，获取 bool返回值
if(fn(this[i], i,this)){
// 将元素添加到新数组
newArr.push(this[i]);
}
}
return newArr;
}
// 调⽤测试：
let list9 =[
{ name:'j', age:12},
{ name:'a', age:22},
{ name:'m', age:32},
{ name:'e', age:42},
{ name:'s', age:52}
]
;
let list10 = filter((v, i)=>{
return v.age >22;filter过滤对象数组
});
console.log(list10);
3.2 map ⽅法
作⽤： 返回⼀个新数组，数组中的元素为原始数组元素调⽤函数处理后的值遍历 原数组 中的元素并调⽤回调函数，将回调函数返回值添加到⼀个 新数组 中返回不会改变原始数组，只是 把回调函数返回值 添加到新数组
参数：array.map(回调函数( currentValue,index,arr ))
value - 当前元素值
index - 当前元素下标
arr - 当前数组
返回值：
将遍历数组 时每次调⽤ 回调函数 的返回值 添加到新数组 返回
本质：对数组做循环，并取出元素传⼊回调函数，将回调函数返回值添加到新数组返回例⼦：遍历对象，将每个对象的 age 添加到新数组 返回
let list5 =[
{ name:'j', age:12},
{ name:'a', age:22},
{ name:'m', age:32},
{ name:'e', age:42},
{ name:'s', age:52}
];
let list6 = list5.map((v, i)=>{
return v.age;
});
console.log(list6);// [ 12, 22, 32, 42, 52 ]
扩展：⾃⼰模仿⼀个数组的 map ⽅法，返回 由 回调函数 return元素 组成的新数组
// 为数组原型添加⼀个 mymap ⽅法
ap=function(fn){
let newArr =[];
// 遍历当前数组
for(let i =0; i <this.length; i++){
// 调⽤回调函数，传⼊当前元素，下标，原数组本⾝let newEle =fn(this[i], i,this);
// 将返回值添加到新数组
newArr.push(newEle);
}
return newArr;
}
// 调⽤测试：
let list7 =[
{ name:'j', age:12},
{ name:'a', age:22},
{ name:'m', age:32},
{ name:'e', age:42},
{ name:'s', age:52}
];
let list8 = ap((v, i)=>{
return v.age;
});
console.log(list8);

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。