JavaScript findIndex()

由名稱推測，findIndex方法用來查詢陣列元素的索引。

事實也是如此，它可以返回陣列中滿足指定條件元素的索引值。

ES2015新增此方法。

語法結構：

[JavaScript] 純文字檢視 複製程式碼
arr.findIndex(callback(element,index,array)[, thisArg])

引數解析：

（1）.callback:必需，對陣列每一項所要執行的函式。

         element：當前遍歷到的陣列元素。

         index：當前遍歷到的陣列元素索引。

         array：陣列本身。

（2）.thisArg:可選，規定callback回撥函式this所指向的物件。

此方法會逐個對陣列中的元素執行callback回撥函式，如果回撥函式返回值為true，那麼就停止整個函式的執行，並返回當前陣列元素的索引值，否則返回-1。

特別說明：

（1）.回撥函式的返回值並不一定非要是true本身，只要可以轉換為true即可。

（2）.當第一次呼叫callback函式時，陣列arr元素數量就已經確定，那麼findIndex方法執行後新增的元素不計算在內，也就是不會對它們執行callback函式。

（3）.如果未被callback函式訪問到的元素的值改變，那麼當callback函式訪問到它時，使用當前值。

程式碼例項如下：

[JavaScript] 純文字檢視 複製程式碼執行程式碼
let arr = [2,3,-5,4,6,10];
let index=arr.findIndex(function (ele) {
  if (ele > 4) {
    return true
  }
})
console.log(index);

陣列元素6第一個滿足條件，那麼將會返回它的索引值4。

[JavaScript] 純文字檢視 複製程式碼執行程式碼
let arr = [2,3,-5,4,6,10];
let index=arr.findIndex(function (ele) {
  if (ele > 4) {
    return "螞蟻部落"
  }
})
console.log(index);

回撥函式的返回值沒必要直接是true，只要能轉換為true即可。

[JavaScript] 純文字檢視 複製程式碼執行程式碼
let arr = [2,3,5,4,6,10];
let index = arr.findIndex(function (ele, index) {
  if(index=0){
    arr.push(11);
    console.log(arr);
  }
  if(ele>10){
      return true
  }
})
console.log(index);

程式碼執行效果截圖如下：

雖然11已經被追加到陣列，並且大於10，但是findIndex方法的返回值依然是-1。

由此可見回撥函式開始執行以後，新增的陣列元素不會被回撥函式訪問到。

[JavaScript] 純文字檢視 複製程式碼執行程式碼
let arr = [2,3,5,4,6,10];
let index = arr.findIndex(function (ele, index,arr) {
  if(index==0){
    arr[3]=11;
    console.log(arr);
  }
  if(ele>10){
      return true
  }
})
console.log(index);

程式碼執行效果截圖如下：

由此可見尚未被callback函式訪問的元素，如果被修改，依然可以訪問。

[JavaScript] 純文字檢視 複製程式碼執行程式碼
let arr = [2, 3, 5, 4, 6, 10];
let obj = {
  num:5
}
let index = arr.findIndex(function (ele, index) {
  if (ele > this.num) {
    return true;
  }
}, obj)
console.log(index);

上面程式碼中，回撥函式的this被修改指向物件obj。