arr.find()和arr.filter()函数说明

1VR

已于 2023-05-07 10:53:32 修改

阅读量1.1k

点赞数 2

文章标签： javascript vue.js 开发语言

于 2023-05-07 10:43:03 首次发布

本文链接：https://blog.csdn.net/zhtxilyj/article/details/130539969

版权

文章介绍了JavaScript中的数组方法find和filter的用法，通过示例展示了如何利用这两个方法查找符合条件的元素。find方法返回数组中第一个匹配条件的元素，而filter则返回所有匹配条件的新数组。在示例中，涉及了基于属性和条件的复杂查找操作，如按性别和年龄筛选人员信息。

摘要由CSDN通过智能技术生成

arr.find() 是 JavaScript 数组的一个方法，用于查找数组中第一个符合条件的元素。

const arr = [2, 4, 6, 8];
const found = arr.find(element => element > 5);
console.log(found); // 6

除了简单的比较之外，我们还可以利用 find() 方法构建更复杂的查找条件。例如

const people = [
  { name: '张三', age: 25, gender: 'male' },
  { name: '李四', age: 30, gender: 'male' },
  { name: '王五', age: 28, gender: 'female' }
];
const found = people.find(person => person.gender === 'female' && person.age > 25);
console.log(found); // {name: "王五", age: 28, gender: "female"}

arr.filter()是找到所有符合条件的记录并以新数组形式展示

const numbers = [1, 2, 3, 4, 5];
const evenNumbers = numbers.filter(number => number % 2 === 0);

console.log(evenNumbers); // [2, 4]

更复杂一点的例如：

const people = [
  { name: '张三', age: 25, gender: 'male' },
  { name: '李四', age: 30, gender: 'male' },
  { name: '王五', age: 28, gender: 'female' }
];
const found = people.filter(person => person.gender === 'female' && person.age > 25);
console.log(found); //[{name: "王五", age: 28, gender: "female"},{ name: '王五', age: 28, gender: 'female' }]