Encontrar index de objeto dentro de un arreglo usando Array.findIndex()

Question

Bien antes que nada quiero comentar que tengo una estructura de datos de la siguiente manera:

     arrayJson = [{"point":[5,4]},{"point":[2,2]},{"point":[1,6]},
                   {"point": [8,9]} ]

El objetivo es encontrar el indice dentro del arreglo que cumpla una condicion y es que "point" sea igual a un valor determinado, he intentado hacerlo de la siguiente manera:

      function encontrarElemento(element) {
          return element.point == [5,4];
        }
       console.log(array1.findIndex(encontrarElemento));

No se por qué, pero la salida en la consola me dice que es -1, lo que quiere decir que no esta encontrando el elemento.

los Arrays son [Objetos](https://es.stackoverflow.com/questions/143847/javascript-por-qu%C3%A9-y-son-falso/143907#143907) por ello no lo puedes comprar directamente, recuerda que [un JSON no es un Objeto](https://es.stackoverflow.com/questions/164943/cu%C3%A1l-es-la-diferencia-entre-json-y-un-objeto-en-javascript) — JackNavaRow, May 10 '19 at 14:33

phpMyGuel · Answer 1 · 2019-05-10T10:35:52.830

Tenías errores de formato en el JSON que has puesto. Una vez solucionado he pensado en esta solución.

arrayJson = [{"point":[5,4]},{"point":[2,2]},{"point":[1,6]},{"point": [8,9]}];

console.log(encontrarElemento(arrayJson, [5, 4]));

function encontrarElemento(elemento, buscar) {
  for (var point in elemento) { 
    if (JSON.stringify(elemento[point]['point']) === JSON.stringify(buscar)) {
      return elemento[point]['point'];
    }
    else {
      return ('Elemento no encontrado');
    }
  }
}

Lo primero que hice fue montar un bucle para recorrer los elementos del JSON. Al no haber un método directo de comparación de arrays (que yo conozca), lo que se me ocurrió es transformarlos a formato JSON para así poder compararlos y de esta manera devolver el elemento que necesitas.

EDIT

El código de arriba devolvería el elemento que cumpla con el patrón de búsqueda. Si lo que necesitas es que devuelva la posición del array en la que se encuentra podrías usar algo como esto:

arrayJson = [{"point":[5,4]},{"point":[2,2]},{"point":[1,6]},{"point": [8,9]}];

var respuesta =  arrayJson.findIndex((item) => JSON.stringify(item.point) === JSON.stringify([1, 6]));
    
console.log(respuesta);

Releyendo tu pregunta, vi que quizás necesitases la posición del elemento en el *array* y no el elemento en sí. Hice una edición a mi respuesta para contemplar ese caso. — phpMyGuel, May 10 '19 at 09:53

Fernando Carrascosa · Accepted Answer · 2019-05-14T08:28:53.093

4

Vayamos por partes:

La comparación entre Arrays no es igual que una comparación entre otros tipos en JavaScript, si comparas 1 === 1 será true, pero si comparas [1] === [1] el resultado es false. Por eso tu findElemento() no funciona como se espera.

Una idea que se me ha ocurrido para aproximarlo es reducir primero los valores a booleanos y luego encontrar el índice de true:

const arrayJson = [
  {"point": [5,4]},
  {"point": [2,2]},
  {"point": [1,6]},                 
  {"point": [8,9]} ,
];

const findElementIndexInArray = (element, array) => 
   array.map(({point}) => 
            point.reduce((prev, value, pointIndex) => prev && (value === element[pointIndex]))
).indexOf(true);

const a = findElementIndexInArray([5, 4], arrayJson);
console.log(a)

Mira a ver si esto te sirve

edited May 14 '19 at 08:28

answered May 10 '19 at 11:35

Fernando Carrascosa

1,748
3
15

Efectivamente es lo que estaba buscando, excelente solución – j-j suarez May 10 '19 at 13:51
Me alegro mucho de que te sirviera =) Los array han implementado muchísimos métodos nuevos de un tiempo a esta parte que es muy interesante mirar. – Fernando Carrascosa May 10 '19 at 14:05

score 0 · Answer 3 · answered May 10 '19 at 12:21

0

console.log(arrayJson.findIndex(item => item.point[0] === 5 && item.point[1] ===4));

Convertir a json para comparar es más costoso y se entiende peor que comparar los datos concretos.

Usar map, reduce e indexOf es dificil de leer.

La comparación de objetos, y los arrays son objetos, no se debe hacer con == porque ahí estas comparando si se trata del mismo objeto, no si el valor es el mismo. Por ejemplo:

var a = [1];
var b = [1];
var c = a;

console.log(a == b); //false
console.log(a == c); // true

answered May 10 '19 at 12:21

David Moreno Cortina

372
1
7

2

¿Y si el *array* cambia y los *point* comienzan a tener 3 valores en vez de dos? Te tocaría modificar todas las llamadas a esa función para añadirle un tercer *and*. Es cierto que comparar directamente los valores es más óptimo en cuestión de rendimiento, pero también es menos modular. Lo que ganas de un lado lo pierdes por el otro. – phpMyGuel May 10 '19 at 12:58
¿Y si la key "point" cambia de nombre? Es una función para comparar 2 puntos en una aplicación, no una librería – David Moreno Cortina May 10 '19 at 15:47

Encontrar index de objeto dentro de un arreglo usando Array.findIndex()

3 Answers3