[TOC] #### 1. 前言 --- JavaScript 的 Array 對象方法太多了，短時(shí)間內(nèi)記不住的，可以每天學(xué)幾個(gè)，日積月累，積少成多 ! ES6 中新增了很多實(shí)用的數(shù)組方法，`array.find()` 和 `array.findIndex` 就是其中兩個(gè) `array.find()` 方法用于獲取數(shù)組中滿足指定條件的第一個(gè)元素的值 `array.findIndex()` 方法用于獲取數(shù)組中滿足指定條件的第一個(gè)元素的索引 ```javascript const array = [ { id: 1, name: 'tom' }, { id: 2, name: 'jerry' }, { id: 3, name: 'maria' }, ] ``` #### 2. array.find() --- 完整形式 ```javascript // item 數(shù)組元素 // index 數(shù)組索引 // array 當(dāng)前元素所屬數(shù)組 // thisValue 參數(shù)1的函數(shù)體中的this指向,默認(rèn)是Window對象 // 注意: 其中 index, array, thisValue 都是可選參數(shù),大多數(shù)情況下都是只使用 item array.find(function(item, index, array) { }, thisValue) ``` 關(guān)于 `thisValue` 參數(shù)的用法 ```javascript array.find(function (item, index, array) { // 省略 thisValue 參數(shù)時(shí), this 指向 Window 對象 console.log(this) }) const user = { name: 'liang' } array.find(function (item, index, array) { // 此時(shí) this 指向 user 變量, // 特別注意: 當(dāng)前函數(shù)必須為普通函數(shù),不能用箭頭函數(shù),懂的都懂 console.log(this) }, user) ``` 最常見的用法 ```javascript // 查找數(shù)組元素中 name 為 jerry 元素 // 找到返回該元素, 否則返回 undefined const item = array.find(item => item.name == 'jerry') ``` 也可以傳入一個(gè)函數(shù)名稱，效果是一樣的 ```javascript function jerryInfo(item) { return item.name == 'jerry'; } const item = array.find(jerryInfo) ``` #### 3. array.findIndex() --- array.findIndex() 參數(shù)同 array.find() 一致，都是用于查找滿足指定條件的數(shù)組中的第一個(gè)元素，區(qū)別是當(dāng)能查找的到時(shí), find 返回的是數(shù)組元素，findIndex 返回的是數(shù)組索引；當(dāng)查找不到時(shí)，find 返回 undefined，findIndex 返回 -1 ```javascript const index = array.findIndex(item => item.name == 'jerry') console.log(index) // 1 const index = array.findIndex(item => item.name == 'cat') console.log(index) // -1 ```