Array.prototype.find()

El método find() devuelve el valor del primer elemento del array que cumple la función de prueba proporcionada. En cualquier otro caso se devuelve undefined.

function isBigEnough(element) {
  return element >= 15;
}

[12, 5, 8, 130, 44].find(isBigEnough); // 130

Vea también el método findIndex(), que devuelve el índice del elemento encontrado en el array en lugar de su valor.

Si necesitas encontrar la posición de un elemento o determinar si un elemento existe en un array, utiliza Array.prototype.indexOf()Array.prototype.includes().

Sintaxis

arr.find(callback[, thisArg])

Parámetros

callback
Función que se ejecuta sobre cada valor en el array, tomando tres argumentos:
element
El elemento actual que se está procesando en el array.
index
El índice del elemento actual que se está procesando en el array.
array
El array desde el que se llama al método find.
thisArg
Opcional. Objecto para usar como this cuando se ejecuta callback.

Valor devuelto

Un valor en el array si el elemento pasa la prueba; de lo contrario, undefined.

Descripción

El método find ejecuta la función callback una vez por cada índice del array hasta que encuentre uno en el que el callback devuelva un valor true. Si dicho elemento se encuentra, find devuelve inmediatamente el valor del elemento. En caso contrario, find devuelve undefined. callback se invoca por cada índice del arrray desde 0 hasta length - 1 y se invoca para todos los índices, no sólo a aquellos que tengan un valor asignado. Esto puede significar que es menos eficiente para arrays con índices vacíos con respecto a otros métodos que sólo visitan los índices que tengan un valor asignado.

callback se invoca con tres argumentos: el valor del elemento, el índice del elemento y el objeto Array que está siendo recorrido.

Si un parámetro thisArg es proporcionado al método find, este será utilizado como this para cada invocación del callback. Si no se proporciona el parámetro, entonces se utiliza undefined.

find no transforma el array desde el cual es llamado.

El rango de elementos procesados por find se fija antes de la primera invocación de callback. Los elementos añadidos al array después de que comience la llamada a find no serán visitados por callback. Si un elemento existente no visitado del array es cambiado por callback, su valor que se pasa al callback que lo visita será el valor en el momento en que find visita ese índice del elemento; los elementos que sean eliminados son todavía son visitados.

Ejemplos

Encontrar un objeto en un array por una de sus propiedades

var inventario = [
    {nombre: 'manzanas', cantidad: 2},
    {nombre: 'bananas', cantidad: 0},
    {nombre: 'cerezas', cantidad: 5}
];

function encontrarCerezas(fruta) { 
    return fruta.nombre === 'cerezas';
}

console.log(inventario.find(encontrarCerezas)); // { nombre: 'cerezas', cantidad: 5 }

Encontrar un número primo en un array

El siguiente ejemplo encuentra un elemento en un array que sea un número primo (o devuelve undefined si no hay un número primo).

function isPrime(element, index, array) {
  var 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, no encontrado
console.log([4, 5, 8, 12].find(isPrime)); // 5

Los siguientes ejemplos muestran cómo elementos no existentes o eliminados son visitados y el valor pasado a callback es su valor cuando son visitados.

// Declarar un array sin elementos en los índices 2, 3 y 4
var a = [0,1,,,,5,6];

// Muestra todos los índices, no sólo aquellos que tienen valores asignados
a.find(function(value, index) {
  console.log('Visited index ' + index + ' with value ' + value); 
});

// Mostrar todos los índices, incluyendo los eliminados
a.find(function(value, index) {

  // Eliminar el elemento 5 en la primera iteración
  if (index == 0) {
    console.log('Deleting a[5] with value ' + a[5]);
    delete a[5];
  }
  // El elemento 5 se visita aun habiendo sido eliminado
  console.log('Visited index ' + index + ' with value ' + value); 
});

Polyfill

Este método ha sido añadido a la espeficicación ECMAScript 2015 y puede no estar disponible en todas las implementaciones de JavaScript aún. Sin embargo, puedes utilizar el siguiente polyfill de Array.prototype.find:

if (!Array.prototype.find) {
  Array.prototype.find = function(predicate) {
    'use strict';
    if (this == null) {
      throw new TypeError('Array.prototype.find called on null or undefined');
    }
    if (typeof predicate !== 'function') {
      throw new TypeError('predicate must be a function');
    }
    var list = Object(this);
    var length = list.length >>> 0;
    var thisArg = arguments[1];
    var value;

    for (var i = 0; i < length; i++) {
      value = list[i];
      if (predicate.call(thisArg, value, i, list)) {
        return value;
      }
    }
    return undefined;
  };
}

Si se necesita dar soporte a motores de JavaScript realmente obsoletos que no soportan Object.defineProperty, es mejor no utilizar el polyfill para los métodos Array.prototype, ya que no podrás hacerlos no enumerables.

Especificaciones

Especificación Estado Comentario
ECMAScript 2015 (6th Edition, ECMA-262)
The definition of 'Array.prototype.find' in that specification.
Standard Definición inicial.
ECMAScript 2017 Draft (ECMA-262)
The definition of 'Array.prototype.find' in that specification.
Draft  

Compatibilidad con navegadores

Característica Chrome Firefox (Gecko) Internet Explorer Edge Opera Safari
Soporte básico 45.0 25.0 (25.0) No support 12 32.0 7.1
Característica Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Edge Opera Mobile Safari Mobile
Soporte básico No support No support 25.0 (25.0) No support 12 No support 8.0

 

Ver también

Etiquetas y colaboradores del documento

 Colaboradores en esta página: AlePerez92, orgcompany, sancospi, chokozzy, adictovirtual, alo5
 Última actualización por: AlePerez92,