Javascript - Как клонировать объект? - PullRequest
Новая
       70

Javascript - Как клонировать объект?

19 голосов
/ 01 ноября 2011

Я в замешательстве.Я создаю копию из myObjOne, чем я удаляю запись из myObjOne, а JS также удаляет запись в моей копии (myObjTwo)?Но почему? 

  myObjOne = {};
  myObjOne['name'] = 'xxx';
  myObjOne['id'] = 'yyy';
  myObjOne['plz'] = 'zzz';  

  // clone
  myObjTwo = myObjOne;

  // remove something
  delete myObjOne['name'];

  console.dir(myObjTwo);

пример http://jsbin.com/itixes/edit#javascript,html

Ответы [ 8 ]

23 голосов
/ 01 ноября 2011

Обновление: удаление Object.create в качестве метода клонирования, как указано в комментариях. 

  myObjTwo = myObjOne;

не клонируется.Это просто копирует ссылку.

Если вы хотите клонировать, вы можете использовать JSON.parse и JSON.stringify

var x = {a:{b:{c:{'d':'e'}}}};
var y = JSON.parse(JSON.stringify(x));  //y is a clone of x
console.log(y.a.b.c.d); //prints e
console.log(y === x); //prints false

Предупреждение: Как упоминал Райнос в комментариях, этот клон на основе JSONНе сохранять методы входного объекта в выходном объекте.Это решение достаточно хорошо, если ваш объект не содержит никаких методов.Методы - это свойства объекта, которые являются функциями.Если var obj = {add : function(a,b){return a+b;}}, то add - это метод obj.

. Если вам нужно решение, которое поддерживает копирование методов, просмотрите эти ответы SO (как указано Musefan, Matt и Ranhiru Cooray.)

Я бы предложил Как правильно клонировать объект JavaScript?

16 голосов
/ 01 ноября 2011

Вы можете использовать jQuery так: 

var myObjTwo = jQuery.extend(true, {}, myObjOne);

Первый аргумент указывает, что мы хотим сделать глубокую копию myObjOne.

3 голосов
/ 01 ноября 2011

Это не то, как вы клонируете, это просто сохранение того же исходного объекта в дополнительной переменной. Возможно этот ответ поможет вам

2 голосов
/ 01 ноября 2011

Много советов о том, как сделать копию не только объекта и его свойств, но и всех объектов, на которые ссылаются его свойства.Вот версия, которая клонирует объект, не копируя его, и поэтому клон наследует все свойства, добавленные позже, за исключением тех, которые затемняются собственными свойствами клона: 

var cloneOf = (function() {
  function F(){}
  return function(o) {
    F.prototype = o;
    return new F();
  }
}());

Некоторые могут распознать шаблон.Пример: 

var base = {foo:'foo', bar:'bar'};
var baseClone = cloneOf(base);
alert(baseClone.foo);  // foo
1 голос
/ 13 марта 2017

Вы можете использовать Object.assign(), но помните о поддержке браузера.

Подробнее здесь: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign.

Пример: 

myObjTwo = Object.assign({}, myObjOne);
0 голосов
/ 02 мая 2018

В ES6 используйте оператор распространения. 

myObjTwo = {...myObjOne}

Оператор спреда в es6 - это всего лишь многоточие. Создает копию оригинала, даже если оригинал уничтожен

0 голосов
/ 23 октября 2014

Простой. 

var clone=function(o){
      var n= {}.toString.apply(o)=="[object Array]" ? []:{};
      for(i in o)
         n[i]= typeof o[i]=='object' ? clone(o[i]):o[i];
      return n;
 };

Использование: 

var x={a:{d:34},b:33};
var y=clone(x);  // clones 'x'
0 голосов
/ 01 ноября 2011

Ваша строка myObjTwo = myObjOne не клонирует myObjOne, она просто создает дублирующую ссылку на тот же объект!

Фактический ответ - использовать функцию клона, возможно, из библиотеки, такой как underscore.js . Но на самом деле, похоже, у вас есть кое-что для чтения и изучения концепции объектов и указателей в Javascript.

...