ES6 での Array.find() 関数と findIndex() 関数の使用法の詳細な説明

ES6 は、Array に find() 関数と findIndex 関数を追加します。 find() 関数は、ターゲット要素を検索するために使用されます。見つからない場合は、findIndex() 関数もターゲット要素を検索します。要素の位置が見つからない場合は、-1 を返します。以下に例を使って詳しく説明しますので、必要な方は参考にしてください

ES6 では Array に find() 関数と findIndex 関数が追加されます。

find() 関数は、ターゲット要素を検索するために使用されます。見つからない場合は、未定義を返します。

findIndex() 関数もターゲット要素を検索し、見つからない場合はその要素の位置を返します。

これらはすべて検索コールバック関数です。

[1, 2, 3, 4].find((value, index, arr) => {
})

検索機能には 3 つのパラメータがあります。

値: 各反復で検索された配列要素。

index: 各反復で検索された配列要素のインデックス。

arr: 検索される配列。

例:

1. 要素を検索し、見つからなかった場合は、未定義を返します。

const arr1 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]
var ret1 = arr1.find((value, index, arr) => {
 return value > 4
})
var ret2 = arr1.find((value, index, arr) => {
 return value > 14
})
console.log('%s', ret1)
console.log('%s', ret2)

結果:

未定義

2. 要素を検索し、見つかったインデックスを返します。見つからない場合は、-1 を返します。

var ret3 = arr1.findIndex((value, index, arr) => {
 return value > 4
})

var ret4 = arr1.findIndex((value, index, arr) => {
 return value > 14
})
console.log('%s', ret3)
console.log('%s', ret4)

結果:

4
-1

3. NaN を見つけます。

const arr2 = [1, 2, NaN, 4, 5, 6, 7, 8, 9, 10, 11]
var ret5 = arr2.find((value, index, arr) => {
 return Object.is(NaN, value)
})
var ret6 = arr2.findIndex((value, index, arr) => {
 return Object.is(NaN, value)
})
console.log('%s', ret5)
console.log('%s', ret6)

結果:

NaN
2

以上がES6 での Array.find() 関数と findIndex() 関数の使用法の詳細な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。