Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

280
Visualizações
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 Respostas
Responde à pergunta

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 Relatório

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 Relatório

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 Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda