--- title: Array.prototype.find() slug: Web/JavaScript/Reference/Global_Objects/Array/find translation_of: Web/JavaScript/Reference/Global_Objects/Array/find ---
{{JSRef}}

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ề {{jsxref("undefined")}} .

{{EmbedInteractiveExample("pages/js/array-find.html")}}

Xem thêm phương thức {{jsxref("Array.findIndex", "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  {{jsxref("Array.prototype.indexOf()")}} or {{jsxref("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_inline}}
Thứ tự của phần tử hiện tại đang được xử lý trong mảng..
array {{optional_inline}}
Mảng được gọi.
thisArg {{optional_inline}}
Đố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ề {{jsxref("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ề {{jsxref("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ì {{jsxref("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ề {{jsxref("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
{{SpecName('ES2015', '#sec-array.prototype.find', 'Array.prototype.find')}} {{Spec2('ES2015')}} Initial definition.
{{SpecName('ESDraft', '#sec-array.prototype.find', 'Array.prototype.find')}} {{Spec2('ESDraft')}}

Tính Tương Thích Với Trình Duyệt Web

{{Compat("javascript.builtins.Array.find")}}

Những Phương Thức Liên Quan