Що робить Object.assign()?

JavaScriptJunior~1 хв читання

Object.assign() - це вбудований метод JavaScript, який використовується для копіювання властивостей з одного або кількох об'єктів в інший об'єкт.

Він дозволяє об'єднувати об'єкти і створювати поверхневі копії.

Синтаксис

javascript

Object.assign(target, ...sources)

Параметр	Опис
`target`	Об'єкт, в який копіюються властивості
`sources`	Один або кілька об'єктів-джерел, з яких беруться властивості

Повертає сам target.

Простий приклад

javascript

const user = { name: 'Alice' };
const details = { age: 25, city: 'Kyiv' };

Object.assign(user, details);

console.log(user);
// { name: 'Alice', age: 25, city: 'Kyiv' }

Усі властивості з details скопійовані в user. Якщо ключі збігаються, значення перезаписуються.

Приклад з перезаписом властивостей

javascript

const a = { name: 'Alice', age: 25 };
const b = { age: 30, city: 'Kyiv' };

const result = Object.assign(a, b);

console.log(result); // { name: 'Alice', age: 30, city: 'Kyiv' }
console.log(a === result); // true (a змінено)

Важливо: Object.assign() змінює перший аргумент (target). Якщо не хочеш мутувати об'єкт - передавай порожній об'єкт як перший параметр:

javascript

const merged = Object.assign({}, a, b);

Клонування об'єкта

javascript

const user = { name: 'Alice', city: 'Kyiv' };

const clone = Object.assign({}, user);

console.log(clone); // { name: 'Alice', city: 'Kyiv' }
console.log(clone === user); // false (різні об'єкти)

Це створює поверхневу копію: вкладені об'єкти копіюються за посиланням, а не дублюються.

Приклад із вкладеним об'єктом (shallow copy)

javascript

const user = {
  name: 'Alice',
  address: { city: 'Kyiv' }
};

const clone = Object.assign({}, user);

clone.address.city = 'Lviv';

console.log(user.address.city); // "Lviv" - посилання одне!

Тобто Object.assign() робить поверхневе копіювання, а не глибоке. Для глибокої копії краще використовувати structuredClone() або _.cloneDeep().

Приклад об'єднання кількох джерел

javascript

const a = { x: 1 };
const b = { y: 2 };
const c = { z: 3 };

const merged = Object.assign({}, a, b, c);
console.log(merged); // { x: 1, y: 2, z: 3 }

Дозволяє об'єднувати кілька об'єктів в один.

Можна копіювати значення з примітивів

javascript

const target = {};
Object.assign(target, { a: 1 }, 'abc', null);

console.log(target);
// { '0': 'a', '1': 'b', '2': 'c', a: 1 }

Рядок "abc" поводиться як масив символів, кожна буква стає властивістю '0', '1', '2'.

Об'єднання з наявними об'єктами (частий прийом)

javascript

const settings = { darkMode: false, lang: 'en' };
const userSettings = { darkMode: true };

const final = Object.assign({}, settings, userSettings);
console.log(final); // { darkMode: true, lang: 'en' }

Часто використовується для "злиття типових налаштувань" з користувацькими.

Підсумок

Що робить	Приклад	Поведінка
Копіює властивості з одного об'єкта в інший	`Object.assign(a, b)`	Мутує `a`
Створює поверхневу копію	`Object.assign({}, obj)`	Не мутує вихідний об'єкт
Об'єднує кілька об'єктів	`Object.assign({}, a, b, c)`	Останні перезаписують попередні
Глибоку копію не робить	-	Вкладені об'єкти копіюються за посиланням

Коротка відповідь

Для співбесіди

Premium

Коротка відповідь допоможе вам впевнено відповідати на цю тему під час співбесіди.