JavaScript Array find() 方法
示例 1
查詢第一個值大於 18 的元素的值
const ages = [3, 10, 18, 20];
function checkAge(age) {
return age > 18;
}
function myFunction() {
document.getElementById("demo").innerHTML = ages.find(checkAge);
}
自己動手試一試 »
描述
find()
方法返回透過測試的第一個元素的值。
find()
方法為陣列中的每個元素執行一次函式。
如果沒有元素透過測試,find()
方法返回 undefined
。
find()
方法不會為空元素執行函式。
find()
方法不會改變原始陣列。
陣列查詢方法
方法 | 查詢 |
---|---|
indexOf() | 具有指定值的第一個元素的索引 |
lastIndexOf() | 具有指定值的最後一個元素的索引 |
find() | 透過測試的第一個元素的值 |
findIndex() | 透過測試的第一個元素的索引 |
findLast() | 透過測試的最後一個元素的值 |
findLastIndex() | 透過測試的最後一個元素的索引 |
語法
array.find(function(currentValue, index, arr),thisValue)
引數
function() | 必需。 為每個陣列元素執行的函式。 |
currentValue | 必需。 當前元素的值。 |
index | 可選。 當前元素的索引。 |
arr | 可選。 當前元素所屬的陣列。 |
thisValue | 可選。預設 undefined 。作為其 this 值傳遞給函式的值。 |
返回值
型別 | 描述 |
一個值 | 第一個透過測試的元素的值。 否則返回 undefined 。 |
示例 2
查詢第一個值大於特定數字的元素的值
<p><input type="number" id="ageToCheck" value="18"></p>
<button onclick="myFunction()">試一試</button>
<p id="demo"></p>
<script>
const ages = [4, 12, 16, 20];
function checkAge(age) {
return age > document.getElementById("ageToCheck").value;
}
function myFunction() {
document.getElementById("demo").innerHTML = ages.find(checkAge);
}
</script>
自己動手試一試 »
瀏覽器支援
find()
是 ECMAScript6 (ES6) 的特性。
自 2017 年 6 月起,所有現代瀏覽器都支援 ES6 (JavaScript 2015)
Chrome 51 | Edge 15 | Firefox 54 | Safari 10 | Opera 38 |
2016 年 5 月 | 2017 年 4 月 | 2017 年 6 月 | 2016 年 9 月 | 2016 年 6 月 |
Internet Explorer 不支援 find()
。