Array.prototype.find() 是 JavaScript 的一個數組方法,它被用來在數組中查找一個符合條件的元素。一旦找到第一個符合條件的元素, find() 會立即返回這個元素的值,否則返回 undefined。
以下是 find() 方法的基本語法:
arr.find(callback(element[, index[, array]])[, thisArg])
參數:
callback: 回調函數,在數組每個元素上執行,接受三個參數:currentValue : 數組中正在處理的當前元素。
index (可選): 數組中正在處理的當前元素的索引。
array (可選): find() 方法被調用的數組。
thisArg (可選): 執行回調時用作 this 的對象。
返回值:
返回數組中第一個滿足所提供測試函數的元素的值,否則返回 undefined。
1.使用currentValue 參數:
// 例子1:尋找數組中第一個大于10的元素
let array = [5, 12, 8, 130, 44];
/**
我們傳給 find() 函數一個回調函數,該函數會對數組的每個元素進行測試。當找到第一個大于10的數時,find() 就立即返回這個數。
*/
let found = array.find(element => element > 10);console.log(found,'-----------found'); // 輸出: 12
2.使用 currentValue 和 index 參數
/**
例子2:除了檢查元素是否大于10,我們還檢查其索引是否大于2。因此,find() 返回的是第一個在索引大于2且值大于10的元素。
*/
var array2 = [5, 12, 8, 130, 44];var found = array2.find(function(element, index) {return element > 10 && index > 2;
});console.log(found); // 130
3.使用 currentValue,index 和 arr 參數
/**
例子3:我們查找最后一個元素(索引等于數組長度減一)且該元素大于10的元素。因為44不滿足條件,所以返回 undefined。
*/var array3 = [5, 12, 8, 130, 44];var found = array3.find(function(element, index, arr) {return element > 10 && index === arr.length - 1;
});console.log(found); // undefined
4.其他
// 例子4:取出testData中與test對應的對象
const testData = ref([{id:1,name:'測試1'
},{id:2,name:'測試2'
},{id:3,name:'測試3'
},{id:4,name:'測試4'
},])const test = ref(testData.value[0].id) // 1
const findTest = testData.value.find((item)=> item.id == test.value)console.log(testData.value,'-----------testData');
console.log(test.value,'-----------test');//1
console.log(findTest,'-----------findTest'); // { id:1, name:'測試1' }