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