Phương thức find()
sẽ trả về giá trị đầu tiên tìm thấy ở trong mảng được cung cấp. Hoặc có thể trả về undefined
.
The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
Xem thêm phương thức findIndex()
, sẽ trả về index của phần tử tìm thấy trong mảng thay vì giá trị của nó.
Nếu bạn muốn tìm vị trí của phần tử hoặc tìm phần tử đó có tồn tại trong mảng hay không, hãy thử sử dụng Array.prototype.indexOf()
or Array.prototype.includes()
.
Cú Pháp
arr.find(callback(element[, index[, array]])[, thisArg])
Parameters ( thông số đầu vào )
callback
- Hàm thực thi với mỗi giá trị trong mảng, chuyền vào 3 giá trị :
element
- Phần tử hiện tại đang được xử lý trong mảng.
index
Optional- Thứ tự của phần tử hiện tại đang được xử lý trong mảng..
array
Optional- Mảng được gọi.
thisArg
Optional- Đối tượng tùy chọn để sử dụng như thế này khi thực hiện
callback
.
Return value ( giá trị trả về )
Giá trị ( value ) của phần tử đầu tiên ( first element ) trong mảng thỏa mãn chức năng kiểm tra được cung cấp. Nếu không, sẽ trả về undefined
.
Mô Tả
Phương thức find thực thi hàm
callback
với mỗi giá trị trong mảng cho đến khi tìm được giá trị mà hàm callback
trả về giá trị. Nếu phần tử đó được tìm thấy, phương thức find sẽ
trả về giá trị của phần tử đó. Nếu không tìm thấy, find
sẽ trả về undefined
. callback
được gọi cho mọi index
có trong mảng từ 0
đếnlength - 1
và cho tất cả các indexes
, không chỉ những giá trị đã được gán. Điều này chỉ ra rằng nó có thể kém hiệu quả hơn so với các phương thức khác chỉ truy cập các indexes
có giá trị được gán.
callback
được gọi với ba arguments: giá trị của phần tử ( the value of the element ), biến đếm của phần tử ( the index of the element ) và đối tượng mảng cần tìm ( the Array object being traversed ).
Nếu thisArg
tham số ( parameter ) cung cấp cho phương thức find
, nó sẽ được sử dụng như là giá trị this
cho mỗi lần gọi callback
. Nếu không được cung cấp tham số, thì undefined
sẽ được thay thế.
Phương thức find
sẽ không làm thay đổi mảng mà nó được gọi hoặc sử dụng.
Phạm vi của các phần tử được xử lý bởi find
sẽ được gán trước ghi gọi hàm callback
. Vì thế, callback
sẽ không truy cập các phần tử được gắn vào mảng sau khi phương thức find được
bắt đầu. Các phần tử bị xóa vẫn có thể truy cập được.
Ví Dụ
Tìm một đối tượng trong một mảng bằng một trong các thuộc tính
const inventory = [
{name: 'apples', quantity: 2},
{name: 'bananas', quantity: 0},
{name: 'cherries', quantity: 5}
];
function isCherries(fruit) {
return fruit.name === 'cherries';
}
console.log(inventory.find(isCherries));
// { name: 'cherries', quantity: 5 }
Sử dụng arrow function ( ES2015 )
const inventory = [
{name: 'apples', quantity: 2},
{name: 'bananas', quantity: 0},
{name: 'cherries', quantity: 5}
];
const result = inventory.find( fruit => fruit.name === 'cherries' );
console.log(result) // { name: 'cherries', quantity: 5 }
Tìm số nguyên tố trong mảng
Theo ví dụ sau đây tìm thấy một phần tử trong mảng là số nguyên tố (hoặc sẽ trả về undefined
nếu trong mảng không có số nguyên tố nào).
function isPrime(element, index, array) {
let start = 2;
while (start <= Math.sqrt(element)) {
if (element % start++ < 1) {
return false;
}
}
return element > 1;
}
console.log([4, 6, 8, 12].find(isPrime)); // undefined, not found
console.log([4, 5, 8, 12].find(isPrime)); // 5
Ví dụ sau đây cho thấy các phần tử không tồn tại và bị xóa vẫn được truy cập và giá trị được chuyển cho callback
lại là giá trị của chúng khi được truy cập.
// Declare array with no element at index 2, 3 and 4
const array = [0,1,,,,5,6];
// Shows all indexes, not just those that have been assigned values
array.find(function(value, index) {
console.log('Visited index ' + index + ' with value ' + value);
});
// Shows all indexes, including deleted
array.find(function(value, index) {
// Delete element 5 on first iteration
if (index == 0) {
console.log('Deleting array[5] with value ' + array[5]);
delete array[5];
}
// Element 5 is still visited even though deleted
console.log('Visited index ' + index + ' with value ' + value);
});
// expected output:
// Deleting array[5] with value 5
// Visited index 0 with value 0
// Visited index 1 with value 1
// Visited index 2 with value undefined
// Visited index 3 with value undefined
// Visited index 4 with value undefined
// Visited index 5 with value undefined
// Visited index 6 with value 6
Polyfill
Phương pháp này đã được thêm vào ECMAScript 2015 và có thể không có sẵn trong tất cả các phiên bản JavaScript. Tuy nhiên, bạn có thể sử dụng Array.prototype.find
với cú pháp :
// https://tc39.github.io/ecma262/#sec-array.prototype.find
if (!Array.prototype.find) {
Object.defineProperty(Array.prototype, 'find', {
value: function(predicate) {
// 1. Let O be ? ToObject(this value).
if (this == null) {
throw new TypeError('"this" is null or not defined');
}
var o = Object(this);
// 2. Let len be ? ToLength(? Get(O, "length")).
var len = o.length >>> 0;
// 3. If IsCallable(predicate) is false, throw a TypeError exception.
if (typeof predicate !== 'function') {
throw new TypeError('predicate must be a function');
}
// 4. If thisArg was supplied, let T be thisArg; else let T be undefined.
var thisArg = arguments[1];
// 5. Let k be 0.
var k = 0;
// 6. Repeat, while k < len
while (k < len) {
// a. Let Pk be ! ToString(k).
// b. Let kValue be ? Get(O, Pk).
// c. Let testResult be ToBoolean(? Call(predicate, T, « kValue, k, O »)).
// d. If testResult is true, return kValue.
var kValue = o[k];
if (predicate.call(thisArg, kValue, k, o)) {
return kValue;
}
// e. Increase k by 1.
k++;
}
// 7. Return undefined.
return undefined;
},
configurable: true,
writable: true
});
}
Đặc Điểm
Specification | Status | Comment |
---|---|---|
ECMAScript 2015 (6th Edition, ECMA-262) The definition of 'Array.prototype.find' in that specification. |
Standard | Initial definition. |
ECMAScript (ECMA-262) The definition of 'Array.prototype.find' in that specification. |
Living Standard |
Tính Tương Thích Với Trình Duyệt Web
BCD tables only load in the browser
Những Phương Thức Liên Quan
Array.prototype.findIndex()
– find and return an indexArray.prototype.includes()
– test whether a value exists in the arrayArray.prototype.filter()
– find all matching elementsArray.prototype.every()
– test all elements togetherArray.prototype.some()
– test at least one element