Buscar índice de objeto en un array de JavaScript

1. Utilice el método findIndex() para encontrar el índice del objeto en un array en JavaScript
2. Utilice la biblioteca lodash para encontrar el índice de objeto en el array de JavaScript

Este artículo explorará el método findIndex() y el uso de lodash para encontrar el índice del objeto dentro de JavaScript Array.

Utilice el método findIndex() para encontrar el índice del objeto en un array en JavaScript

ES6 agregó un nuevo método llamado findIndex() al Array.prototype, que devuelve el primer elemento de un array que pasa la prueba proporcionada. El método findIndex() devuelve el índice del elemento que satisface una función de prueba o -1 si ningún elemento pasó la prueba. El findIndex() es mejor para matrices con tipos no primitivos (por ejemplo, objetos) para encontrar el índice de un elemento.

Proporcionamos una devolución de llamada como primer parámetro en el Array.prototype.findIndex(). Este método es útil si el índice de los arrays no es primitivo. Podemos usar este método si el índice del array es más que valores. Después de devolver el primer elemento que coincide con la condición especificada, findIndex() deja de comprobar el array para los elementos restantes en el array.

La sintaxis de findIndex() se muestra a continuación.

array.findIndex(function(currentValue, index, arr))

Opcionalmente, index y arr se pueden pasar a la función de devolución de llamada. La opción index apunta al índice del elemento actual en el array, mientras que arr es el objeto de array al que pertenece el elemento actual. El findIndex() devuelve -1 si la condición especificada en el array no coincide.

Supongamos que tenemos la siguiente matriz con tipos primitivos, y nos gustaría encontrar el índice del elemento que tiene una edad mayor de 18. Luego, podemos usar findIndex() para encontrar el índice del primer elemento que coincide con la condición especificado.

Código de ejemplo:

const ages = [3, 10, 17, 23, 52, 20];
let index = ages.findIndex(age => age > 18);
console.log(index);

Producción :

3

Dado que el primer elemento que coincide con la condición especificada tiene un índice de 3 ya que está por encima de 18, obtenemos el valor del índice como 3.

Ahora podemos usar la misma lógica para encontrar el índice de objeto que coincide con la condición que especificamos con el método findIndex(). Podemos usar findIndex() para encontrar el índice de una persona que ha obtenido una calificación de B.

Código de ejemplo:

const Result =
    [
      {
        name: 'John',
        grade: 'A',
      },
      {
        name: 'Ben',
        grade: 'C',
      },
      {
        name: 'Anthony',
        grade: 'B',
      },
      {
        name: 'Tim',
        grade: 'B-',
      },
    ]

    const index = Result.findIndex((element) => element.grade === 'B');
console.log(index)

Producción :

2

Aquí, el findIndex() se usa con el array Result, que contiene nuestros datos en forma de objetos JavaScript. Hemos implementado la función de flecha, que también se introdujo con ES6 como una función de devolución de llamada con el método findIndex(). Hemos pasado elemento a la función de devolución de llamada, que contiene el valor actual del objeto en el array que recorremos.

Utilice la biblioteca lodash para encontrar el índice de objeto en el array de JavaScript

Podemos usar la biblioteca liviana lodash, lo que hace que JavaScript sea más fácil al eliminar la molestia de trabajar con matrices, números, objetos, cadenas y más. Podemos descargar el archivo lodash.js del sitio web oficial y cargarlo en la parte superior de nuestro sitio web, como se muestra a continuación.

<script src="lodash.js"> </script>

Podemos instalarlo localmente como npm i --save lodash o yarn add lodash. Con todo configurado, podemos usar el método _.findIndex(). La sintaxis se muestra a continuación.

_.findIndex(array, [predicate = _.identity], [fromIndex = 0])

Aquí, los argumentos array indican el array que necesitamos procesar. La opción [predicate=_.identity] es la función invocada por iteración. La tercera opción [fromIndex=0] es opcional y se puede utilizar para establecer el punto de partida para iniciar la iteración.

Usamos el array creada en el método anterior para la demostración del método lodash.

Ejemplo de código:

var index = _.findIndex(Result, {grade: 'B'})
console.log(index);

Producción :

2