JavaScript Array find()方法

JavaScript中的Array是一种用于存储多个值的数据结构，在处理数组时，经常需要找到满足特定条件的数组元素。这就引出了Array的find()方法，它可以帮助我们在数组中寻找符合条件的元素。

语法

array.find(callback[, thisArg])

参数

• callback: 需要传递一个回调函数，该回调函数接收三个参数，分别是当前元素、当前索引、当前数组。该回调函数应返回一个布尔类型的值，表示当前元素是否符合查找条件。
• thisArg: 可选参数，用于在回调函数中作为this对象，代表执行上下文。

返回值

find()方法会返回第一个符合条件的元素，如果没有找到则返回undefined。

示例

const numbers = [10,20,30,40,50];

// 查找第一个大于30的元素
const result = numbers.find((number) => {
  return number > 30;
});

console.log(result); // 40

在以上示例中，我们通过find()方法在numbers数组中寻找第一个大于30的元素，并将结果存储在result变量中，最终将结果打印到控制台上。

thisArg的使用

const person = {
  name: '张三',
  age: 25,
  books: [
    { title: 'JavaScript高级程序设计', author: 'Nicholas C. Zakas' },
    { title: 'JavaScript权威指南', author: 'David Flanagan' },
    { title: 'ES6标准入门', author: '阮一峰' },
  ],
  findBookByTitle(title) {
    return this.books.find((book) => book.title === title);
  },
};

const book = person.findBookByTitle.call({ books: [...person.books, { title: '深入浅出Node.js', author: '朴灵' }] }, '深入浅出Node.js');

console.log(book); // { title: '深入浅出Node.js', author: '朴灵' }

在以上示例中，我们定义了一个person对象，该对象包含一个findBookByTitle()方法，用于在books数组中寻找符合条件的书籍。我们使用call()方法调用该方法，将thisArg参数设置为包含新书籍信息的对象，这样find()方法在执行回调函数时使用的this对象就变成了新的对象，即{ books: [...person.books, { title: '深入浅出Node.js', author: '朴灵' }] }，最终返回的结果就是符合条件的新书籍对象。