Что за фигня с приравниванием в js?

Question

[mamaanarhiya]

Что это за фигня такая?
Есть какой-то объект obj.
Пишу let anotherObj = obj.
Далее дописываю или меняю что-нибудь в anotherObj и оно же меняется в obj.
То есть допустим пишу anotherObj.tratata = 123. И в obj появляется свойство tratata равное 123.

Comments

[Златослав Десятников]

Вы, вероятно, впервые сталкиваетесь с программированием. Почти во всех современных ЯП объекты (все типы данных, за исключением примитивов) передаются по ссылке — переменные указывают на одну и ту же область в памяти.

Answer 1

[Илья Герасимов]

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

Например:
let anotherObj = Object.assign({}, obj)

Или более продвинутые методы отсюда underscorejs.org или его форка https://lodash.com/docs/4.17.4 (рекомендую), в последнем есть и рекурсивный merge может быть полезным, так же стоит помнить что assing не работает в IE 10-11

Comments

[Александр Моргунов]

Зачем для таких элементарных действий, скачивать дополнительно какие-то либы? Продублирую свой ответ: obj2 = JSON.parse(JSON.stringify(obj1)). Все просто и понятно. Смысл городить что-то?

[Илья Герасимов]

Александр Моргунов, Если нас пугают размеры библиотек, то:

import assign from 'lodash.assign'
let obj2 = assign({}, obj1)

или если нам нужно только наследование то вот такой полифилл, babel transform-object-assign
позволит нам использовать Object.assign не переживая о поддержке другими браузерами

[Павел Корнилов]

Да ладно вам горячиться. Можно и без assign:
anotherObj = Object.create(obj);
Создастся пустой объект, наследующий свойства от obj

[Сергей Соколов]

Александр Моргунов, способ с JSON профукает все методы и всё наследство через прототипы:

var a = {
  prop_a: "prop a",
  meth_a: function(){return "meth a"}
};

function B( set_prop_b ){
  this.prop_b = set_prop_b;
  this.meth_b = function(){return "meth b"}
}
B.prototype = a;


var test = new B("prop b");

test.prop_a;   // prop a
test.meth_a(); // meth a

test.prop_b;   // prop b
test.meth_b(); // meth b

JSON.stringify(test); // {"prop_b":"prop b"}

[abberati]

KorniloFF, следи за руками:

let obj = {a: 1, b: 2};
let anotherObj = Object.create(obj);

delete anotherObj.a;

console.log(anotherObj.a); // 1

[Павел Корнилов]

abberati, не понял ты меня. Ну да ладно, попробую на твоем примере объяснить:

let obj = {a: 1, b: 2};
let anotherObj = Object.create(obj);

anotherObj.a = null;

console.log(anotherObj.a);

[abberati]

KorniloFF, я-то тебя понял. но объект obj ведёт себя отличным от anotherObj образом.
Захочешь, например, установить прототип для anotherObj или проитерироваться по его ключам, что делать будем?

[Павел Корнилов]

Захочешь, например, установить прототип для anotherObj

Установлю его для obj

или проитерироваться по его ключам, что делать будем?

Object.keys даст все родные ключи для anotherObj, а for...in - все с унаследованными.
Поверь, это все решаемо и не проблеммно.
А вот в вопросе ТС было четкое недоумение, почему не копируется объект. Я дал максимально кроссброузерный вариант. Хотя вариант с assign безусловно лучше. Но я бы использовал на сегодняшний день именно такое решение, как привел.

Answer 2

[Ptolemy_master]

Не мешало бы немного ознакомиться с объектами в JavaScript. Когда вы "приравниваете" объекты, вы на самом деле приравниваете ссылки. То есть разные переменные указывают на один и тот же участок памяти. Для того, чтобы избежать этого поведения, следует использовать "клонирование". Делать это можно разными способами, от ручного (создаете вручную объект и приравниваете по очереди все поля от другого) до библиотечных, почти все либы jQuery, Angular etc. имеют функции клонирования.
Вот, по ссылке, почитайте https://stackoverflow.com/questions/728360/how-do-...

Comments

[gleendo]

То есть разные объекты указывают на один и тот же участок памяти.

Неправильно.

как правильно

Разные объекты не могут указывать на один и тот же участок памяти. На то они и "разные", что хранятся в разных местах.

Вам бы:

Не мешало бы немного ознакомиться с объектами в JavaScript.

[Ptolemy_master]

iamevg_, объекты не разные. Приравнивание - это по факту приравнивание указателей, а не самих объектов. Если бы они хранились в разных местах, то такого эффекта, о котором говорил автор, не наблюдалось бы.

[Ptolemy_master]

iamevg_, чтобы не быть голословной:
In JavaScript objects are a reference type. https://developer.mozilla.org/en-US/docs/Web/Java...

Reference value stored in the variable location is a pointer to a location in memory where the object is stored.
https://stackoverflow.com/questions/13266616/primi...

Еще возражения?

[Ptolemy_master]

iamevg_, только сейчас заметила, к чему вы прицепились. Оговорка! Конечно же, не разные объекты, а разные переменные.