es6数组方法find()、findIndex() filter()的总结
2021-04-26 22:26
标签:war 它的 下标 OLE value 西游 过滤 第一个 索引 es6数组方法find()、findIndex() filter()的总结 标签:war 它的 下标 OLE value 西游 过滤 第一个 索引 原文地址:https://www.cnblogs.com/IwishIcould/p/13251565.htmlfind()查找符合条件数组的元素(只能够找出第一个符合条件的)
// 查找出大33的元素.
// find查找第一个符合条件的数组元素(只查找出第一个 找不到返回undefined)
// 它的参数是一个回调函数。在回调函数中可以写你要查找元素的条件,当条件成立为true时,返回该元素。
// 回调函数有三个参数。value:当前的数组元素。index:当前索引值。arr:被查找的数组。
let arr = [11, 22, 33, 44, 45, 66, 77, 88];
let firstArr = arr.find((v) => {
return v > 34
});
console.log(firstArr); //输出44
// 找到下标为1的那个元素
let conarr = [1, 3, 4, 5, 6, 7, 8, 9, 10];
let newArr = conarr.find((value, index, arr) => {
return index == 1;
})
console.log(newArr); //3
查找符合数组元素的下标(只能够找出第一个符合条件的)
// findIndex()与find()的使用方法相同,只是当条件为true时findIndex()返回的是索引值,而find()返回的是元素
// 如果没有符合条件元素时findIndex()返回的是-1,
// 注意find()方法返回的是 undefined
let arr2 = [11, 22, 33];
let newarr1 = arr2.findIndex((v, i, arr) => {
return v > 22;
})
console.log(newarr1) // 输出小标是2
filter()查找符合条件的元素数组,(返回多个只要符合条件)
// filter()与find()使用方法也相同。同样都接收三个参数。不同的地方在于返回值。
// filter()返回的是符合条件的元素数组。通常用于过滤
// find()只返回第一个满足条件的元素。如果条件不满足,返回的是undefined. 满足条件返回第一个元素(只返回一个)
//filter()条件不满足返回的是一个空数组,而find()返回的是undefined,满足条件返回符合元素的数组(返回多个)
let arr3 = [{
book: "三国演义",
id: "180001",
price: 44,
},
{
book: "幻城",
id: "180002",
price: 30
},
{
book: "西游记",
id: "180003",
price: 41
}
];
let newarr4 = arr3.filter((v, i, arr) => {
return v.price > 40
})
console.log(newarr4)
在一个数组中删除某一个特定的值。如在下面的数组中删除小明。返回一个新的数组
let arr5 = [‘小明‘, ‘张三‘, ‘李四‘, ‘王武‘];
let arrindex6 = arr5.findIndex((v, i, arr) => {
return v == "小明"
});
console.log(arrindex6); //输出为0,只能够找到一个
arr5.splice(arrindex6, 1); //注意呀!数组的很多基本方法,会改变原数组,同时返回被删除的那个元素。
console.log(arr5);
// ==============
// 可以将上面的代码优化一下
let arr6 = [‘小明‘, ‘张三‘, ‘李四‘, ‘王武‘];
arr6.splice(arr6.findIndex(v => v == "小明"), 1);
console.log(arr6);
返回被删除的那个元素
arr7= [‘小明‘, ‘张三‘, ‘李四‘, ‘王武‘];
console.log(arr7.splice(0,1));//返回被删除的那个元素
注意和上面的区别
arr8 = [‘小明‘, ‘张三‘, ‘李四‘, ‘王武‘];
arr8.splice(0, 1); //改变原数组。返回被删除的那个元素
console.log(arr8);//?["张三", "李四", "王武"]
文章标题:es6数组方法find()、findIndex() filter()的总结
文章链接:http://soscw.com/index.php/essay/79912.html