Cómo ubicar un objeto particular en una matriz de JavaScript

¿Alguna vez te has encontrado con el requisito de encontrar un objeto en particular en una matriz dada de objetos? En esta publicación, exploraremos varias formas de encontrar un objeto en particular en una matriz de JavaScript. Supongamos que tenemos una matriz como se muestra en la lista a continuación y necesitamos encontrar si [...]

Dhananjay Kumar Last Updated Feb 18, 2025 6min read

    var tasks = [
                { 'Id': '1', 'Title': 'Go to Market 99', 'Status': 'done' },
                { 'Id': '2', 'Title': 'Email to manager', 'Status': 'pending' },
                { 'Id': '3', 'Title': 'Push code to GitHub', 'Status': 'done' },
                { 'Id': '4', 'Title': 'Go for running', 'Status': 'done' },
                { 'Id': '5', 'Title': 'Go to movie', 'Status': 'pending' },
    ];

Para buscar un objeto en particular, usaremos el método de búsqueda de prototipos de matriz. Esto devuelve un valor en un criterio dado, de lo contrario, devuelve 'undefined'. Toma dos parámetros, una función de devolución de llamada requerida y un objeto opcional, que se establecerá como un valor de esto dentro de la función de devolución de llamada.

Array.prototype.find(callbackFunction[,thisArgs])

Se llamará a la función de devolución de llamada para cada elemento de la matriz hasta que la condición dada para un elemento en particular no sea verdadera.
Un objeto que será el valor de this en la función de devolución de llamada es un parámetro opcional, y si no se pasa, el valor se establecerá en undefined en la función de devolución de llamada.

El parámetro de la función de devolución de llamada del método find toma tres parámetros:

element: el elemento actual que se está procesando en la matriz
index: el índice del elemento actual que se está procesando
array: el array en el que se llama al método find

parámetros de la función de devolución de llamada en el método de búsqueda de matriz

Digamos que tenemos una función de devolución de llamada como se muestra en la lista a continuación. Imprimirá el elemento actual, el índice del elemento y la matriz:

function CallbackFunctionToFindTaskById(element, index, array) {

        console.log(element);// print element being processed 
        console.log(index); // print index of the element being processed 
        console.log(array); // print the array on which find method is called 

    }

¿Cómo funciona el método find?

El método find de JavaScript ejecutará la función de devolución de llamada para cada elemento de la matriz. Por lo tanto, si hay 5 elementos en la matriz, la función de devolución de llamada se ejecutaría cinco veces.
El método find de JavaScript interrumpirá la ejecución de la función de devolución de llamada cuando encuentre un criterio verdadero para un elemento en particular.
Si el criterio dado es verdadero para un elemento, el método find de JavaScript devolverá ese elemento en particular y no ejecutará la función de devolución de llamada para los elementos restantes.
Si los criterios no son verdaderos para ningún elemento, el método find de JavaScript devolverá undefined.
El método find de JavaScript no ejecuta la función de devolución de llamada para los índices que no están establecidos o que se han eliminado.
El método find de JavaScript siempre ejecuta la función de devolución de llamada con tres argumentos: elemento, índice, matriz.

¡Veamos algunos ejemplos de uso del método find!

Buscar un objeto según un criterio fijo

Tenemos una matriz de tareas como se muestra en el listado a continuación:

var tasks = [
             { 'Id': '1', 'Title': 'Go to Market 99', 'Status': 'done' },
             { 'Id': '2', 'Title': 'Email to manager', 'Status': 'pending' },
             { 'Id': '3', 'Title': 'Push code to GitHub', 'Status': 'done' },
             { 'Id': '4', 'Title': 'Go for running', 'Status': 'done' },
             { 'Id': '5', 'Title': 'Go to movie', 'Status': 'pending' },
];

Queremos encontrar un objeto con un id de '4'. Podemos hacerlo como se muestra en el siguiente listado:

function CallbackFunctionToFindTaskById(task) {
   return task.Id === '4';
}

var task = tasks.find(CallbackFunctionToFindTaskById);
console.log(JSON.stringify(task));

En la lista anterior, estamos pasando la función de devolución de llamada CallbackFunctionToFindTaskById en el método find de la matriz de tareas. Siempre, el primer parámetro de la función de devolución de llamada representa el parámetro del elemento. Aquí, la tarea representa un elemento dentro de la función de devolución de llamada. Por lo tanto, la tarea representa el elemento que se está procesando actualmente.

En la función de devolución de llamada, estamos verificando el Id de la tarea actual y si es igual a 4, devolviendo la tarea. En este escenario, los criterios se fijan dentro de la función de devolución de llamada.

Buscar un objeto en los criterios pasados en la función de devolución de llamada

En el ejemplo anterior, teníamos un criterio fijo que devolvía un objeto con el id de '4'. Sin embargo, podría haber un requisito en el que queramos pasar los criterios al llamar a la función de devolución de llamada. Podemos pasar un objeto como el valor de este en la función de devolución de llamada. Consideremos de nuevo la misma matriz de tareas, que se muestra en el siguiente listado

var tasks = [
         { 'Id': '1', 'Title': 'Go to Market 99', 'Status': 'done' },
         { 'Id': '2', 'Title': 'Email to manager', 'Status': 'pending' },
         { 'Id': '3', 'Title': 'Push code to GitHub', 'Status': 'done' },
         { 'Id': '4', 'Title': 'Go for running', 'Status': 'done' },
         { 'Id': '5', 'Title': 'Go to movie', 'Status': 'pending' },
];

A continuación, vamos a crear una función de devolución de llamada FindTaskById como se muestra en la lista a continuación:

function FindTaskById(task) {        
   console.log(this);
}

Como puede observar, estamos imprimiendo el valor de "this" dentro de la función de devolución de llamada. A continuación, pasaremos la función de devolución de llamada FindByTask en el método find de la matriz de tareas, como se muestra en la lista a continuación:

var task = tasks.find(FindTaskById,['4','67']);

En este caso, el valor de esta función de devolución de llamada interna se ha establecido en un objeto con dos valores: 4 y 67. En la consola, debería obtener la salida como se muestra a continuación:

El valor de esto se imprime 5 veces porque hay 5 elementos en la matriz de tareas. Para devolver un objeto con el Id establecido en 4, necesitamos modificar la función de devolución de llamada como se muestra en la lista a continuación

   function FindTaskById(task) {

        if (task.Id === this[0]) {
            return task;
        }
    }

    var task = tasks.find(FindTaskById, ['4', '67']);
    console.log(JSON.stringify(task));

En la función de devolución de llamada, estamos pasando el valor de este objeto con la primera propiedad establecida en 4. Por lo tanto, compruebe si la tarea. El id es igual a esto[0] o no devolverá un objeto con id 4.

Conclusión

En esta publicación, aprendimos sobre el método de búsqueda de matriz de JavaScript y varias opciones con la función de devolución de llamada. Tener una mejor comprensión del método de búsqueda es esencial para ser un desarrollador de JavaScript más productivo y espero que hayas disfrutado de la lectura.

Cómo