Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

273
Vistas
Comprender el comportamiento del método Find en Javascript
let arr = [{ age: 3 }, { age: 5 }, { age: 6 }, { age: 7 }]; let exists = arr.find(x => x.age < 4); exists.age += 1; console.log(arr); //output is [{age:4},{age:5},{age:6},{age:7}];

En el ejemplo anterior, estoy actualizando el resultado devuelto por el método de búsqueda, pero también cambia el valor de la matriz original, ¿por qué?

about 4 years ago · Juan Pablo Isaza
3 Respuestas
Responde la pregunta

0

Array.prototype.find devolverá el primer elemento que satisfaga la condición que ha pasado como función de devolución de llamada.

Dado que está buscando un objeto cuya propiedad de age sea menor que 4 . Entonces devolverá el primer objeto (cuya age es 3 ). Entonces, si va a verificar la igualdad de exists y arr[0] , devolverá un objeto que satisfaga la condición

 let arr = [{ age: 3 }, { age: 5 }, { age: 6 }, { age: 7 }]; let exists = arr.find((x) => x.age < 4); console.log(exists === arr[0])

Por lo tanto, si va a realizar algún tipo de mutación con el objeto que devuelve el método de find , el objeto original reflejará los cambios.

Porque ambos son el mismo objeto solo referencias diferentes.


Si no desea mutar el objeto original, debe clonarlo antes de realizar cualquier tipo de cambio en ese objeto.

Note: Both of the following method does shallow copy

1) Usar spread syntax

 let arr = [{ age: 3 }, { age: 5 }, { age: 6 }, { age: 7 }]; let exists = arr.find((x) => x.age < 4); const clone = { ...exists }; clone.age += 1; console.log(arr);
 /* This is not a part of answer. It is just to give the output full height. So IGNORE IT */ .as-console-wrapper { max-height: 100% !important; top: 0; }

2) Uso de Object.assign

 let arr = [{ age: 3 }, { age: 5 }, { age: 6 }, { age: 7 }]; let exists = arr.find((x) => x.age < 4); const clone = Object.assign({}, exists); clone.age += 1; console.log(arr);

about 4 years ago · Juan Pablo Isaza Denunciar

0

Porque tienes una matriz de referencias a objetos. En JavaScript, los objetos en realidad se almacenan en otro lugar (llamado "montón") y las variables de objeto en realidad solo contienen las referencias al objeto. Entonces, la razón es porque está actualizando el mismo objeto.

Si desea hacer una clonación superficial de un objeto, puede usar Object.assign({}, obj) .

Además, no directamente relevante para su pregunta, si las propiedades de su objeto en sí mismas contienen otras referencias de objetos, incluidas matrices, y desea que también sean copias, tendrá que clonarlas en profundidad. Esto no lo hace automáticamente una función o un método de JavaScript estándar. Tendrá que encontrar un código que lo haga por usted o escribirlo usted mismo. La última vez que hice esto, usé la función de clonación de randa porque otro desarrollador de mi equipo ya había importado la biblioteca de ramda a nuestro proyecto. Lo que tiene más sentido para su proyecto puede ser diferente.

about 4 years ago · Juan Pablo Isaza Denunciar

0

Es porque los objetos en JavaScript se pasan por referencia, obtuvo ese objeto ({edad: 3}) en existe y luego agregó 1 a su clave "edad", por lo que el objeto original también cambió.

 let obj1 = {age: 3 , name: 'jack' } let obj2 = obj1 console.log(obj1 === obj2 ) // true // if you change the second object , the first one will change too : obj2.age = 15 console.log(obj1 , obj2 ) // obj1 = { age: 15 , name: 'jack' } // obj2 = { age: 15 , name: 'jack' }

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda