objetos - ¿Cómo copiar el objeto JavaScript a la nueva variable NO por referencia?

recorrer array de objetos javascript

Question

Esta pregunta ya tiene una respuesta aquí:

• ¿Cuál es la forma más eficiente de clonar un objeto en JavaScript? 57 respuestas

Escribí un jsfiddle rápido here , donde paso un pequeño objeto json a una nueva variable y modifico los datos de la variable original (no la nueva variable), pero los datos de la nueva variable también se actualizan. Esto debe significar que el objeto json fue pasado por referencia, ¿verdad?

Aquí está mi código rápido:

var json_original = {one:''one'', two:''two''}
var json_new = json_original;
console.log(json_original); //one, two
console.log(json_new); //one, two
json_original.one = ''two'';
json_original.two = ''one'';
console.log(json_original); //two, one
console.log(json_new); //two, one

¿Hay alguna manera de hacer una copia profunda de un objeto json para que la modificación de la variable original no modifique la nueva variable?

Answer 1

Descubrí que lo siguiente funciona si no estás usando jQuery y solo te interesa clonar objetos simples (ver comentarios).

JSON.parse(JSON.stringify(json_original));

Answer 2

Su única opción es clonar el objeto de alguna manera.

Mira esta pregunta de sobre cómo puedes lograr esto.

Para objetos JSON simples, la forma más simple sería:

var newObject = JSON.parse(JSON.stringify(oldObject));

si usas jQuery, puedes usar:

// Shallow copy
var newObject = jQuery.extend({}, oldObject);
// Deep copy
var newObject = jQuery.extend(true, {}, oldObject);

ACTUALIZACIÓN 2017: Debo mencionar, ya que esta es una respuesta popular, que ahora hay mejores formas de lograr esto utilizando las versiones más nuevas de javascript:

En ES6 o TypeScript (2.1+):

var shallowCopy = { ...oldObject };
var shallowCopyWithExtraProp = { ...oldObject, extraProp: "abc" };

Tenga en cuenta que si extraProp también es una propiedad de oldObject, su valor no se utilizará porque extraProp : "abc" se especifica más adelante en la expresión, que esencialmente lo reemplaza. Por supuesto, oldObject no será modificado.