La modificación de una copia de un objeto de JavaScript hace que el objeto original cambie

estoy copiando objA para objB

const objA = { prop: 1 }, 
const objB = objA; 
objB.prop = 2;
console.log(objA.prop); // logs 2 instead of 1

mismo problema para Arrays

const arrA = [1, 2, 3], 
const arrB = arrA; 
arrB.push(4); 
console.log(arrA.length); // `arrA` has 4 elements instead of 3.

Está claro que tiene algunos conceptos erróneos de lo que la declaración var tempMyObj = myObj; lo hace.

En JavaScript, los objetos se pasan y asignan por referencia (más precisamente, el valor de una referencia), por lo que tempMyObj y myObj son ambas referencias al mismo objeto.

Aquí hay una ilustración simplificada que puede ayudarlo a visualizar lo que está sucediendo.

// [Object1]<--------- myObj

var tempMyObj = myObj;

// [Object1]<--------- myObj
//         ^ 
//         |
//         ----------- tempMyObj

Como puede ver después de la asignación, ambas referencias apuntan al mismo objeto.

Necesitas crear una copia si necesita modificar uno y no el otro.

// [Object1]<--------- myObj

const tempMyObj = Object.assign({}, myObj);

// [Object1]<--------- myObj
// [Object2]<--------- tempMyObj

Respuesta antigua:

Aquí hay un par de otras formas de crear una copia de un objeto.

Como ya estás usando jQuery:

var newObject = jQuery.extend(true, {}, myObj);

Con vainilla JavaScript

function clone(obj) {
    if (null == obj || "object" != typeof obj) return obj;
    var copy = obj.constructor();
    for (var attr in obj) {
        if (obj.hasOwnProperty(attr)) copy[attr] = obj[attr];
    }
    return copy;
}

var newObject = clone(myObj);

Ver aquí y aquí

objeto de clonación profunda con JSON.parse() y JSON.stringify

// Deep Clone
obj = { a: 0 , b: { c: 0}};
let deepClone = JSON.parse(JSON.stringify(obj));

referencia: Este artículo

Mejor referencia: Este artículo

Para resumir todo, y como aclaración, hay tres formas de copiar un objeto JS.

1. A copia normal. Cuando cambia las propiedades del objeto original, las propiedades del objeto copiado también cambiarán (y viceversa).

const a = { x: 0}
const b = a;
b.x = 1; // also updates a.x

2. A copia superficial. Las propiedades de nivel superior serán únicas para el objeto original y el copiado. Sin embargo, las propiedades anidadas se compartirán entre ambos objetos. Usar el operador de propagación ...{} o Object.assign().

const a = { x: 0, y: { z: 0 } };
const b = {...a}; // or const b = Object.assign({}, a);

b.x = 1; // doesn't update a.x
b.y.z = 1; // also updates a.y.z

3. A copia profunda. Todas las propiedades son únicas para el objeto original y las copias, incluso las propiedades anidadas. Para una copia profunda, serialice el objeto en JSON y vuelva a analizarlo en un objeto JS.

const a = { x: 0, y: { z: 0 } };
const b = JSON.parse(JSON.stringify(a)); 

b.y.z = 1; // doesn't update a.y.z

4. Utilizando Object.create() crea un nuevo objeto. Las propiedades se comparten entre los objetos (cambiando uno también cambia el otro). La diferencia con una copia normal es que las propiedades se agregan debajo del prototipo del nuevo objeto. __proto__. Cuando usted Nunca cambie el objeto original, esto también podría funcionar como una copia superficial, pero sugeriría usar uno de los métodos anteriores, a menos que necesite específicamente este comportamiento.

Intente usar el método create() como se menciona a continuación.

var tempMyObj = Object.create(myObj);

Esto resolverá el problema.

Intenta usar $.extender():

Sin embargo, si desea conservar los dos objetos originales, puede hacerlo pasando un objeto vacío como destino:

var object = $.extend({}, object1, object2);

var tempMyObj = $.extend({}, myObj);

usa tres puntos para esparcir el objeto en la nueva variable

const a = {b: 1, c: 0};
let d = {...a};

Como no pude encontrar este código en cualquier lugar alrededor de respuestas sugeridas para casos de copia/clonación superficiales, dejaré esto aquí:

// shortcuts
const {
  create,
  getOwnPropertyDescriptors,
  getPrototypeOf
} = Object;

// utility
const shallowClone = source => create(
  getPrototypeOf(source),
  getOwnPropertyDescriptors(source)
);

// ... everyday code ...

const first = {
  _counts: 0,
  get count() {
    return ++this._counts;
  }
};

first.count;  // 1

const second = shallowClone(first);

// all accessors are preserved
second.count; // 2
second.count; // 3
second.count; // 4

// but `first` is still where it was
first.count;  // just 2

La principal diferencia con respecto a Object.assign o {...spread} operaciones, es que esta utilidad conservará todos los accesores, símbolos, etc., en el proceso, incluida la herencia.

Todas las demás soluciones en este espacio parecen pasar por alto el hecho de que la clonación, o incluso la copia, no se trata solo de valores de propiedades como se recuperan una vez, sino que los accesores y la herencia pueden ser más que bienvenidos en los casos diarios.

Para todo lo demás, use nativo structuredClone método o es polirelleno 👋