Warning: Invalid argument supplied for foreach() in /usr/home/nebulaus/domains/blog.nebula.us/public_html/libraries/src/Cache/Storage/FileStorage.php on line 315 ECMAScript 6: TOP 10 nowości - cz.8 - Object.assign - Front End Nebula - JavaScript, HTML, CSS

W EcmaScript6 dodano bardzo wiele funkcji mających usprawnić najczęściej wykonywane czynności. Jedną z nich jest Object.assign(). Metoda ta znacznie ułatwia pracę z obiektami, czyniąc ich klonowanie, łączenie i nadpisywanie prostszym niż kiedykolwiek.

 Łączenie obiektów

const object1 = { a: 1 };
const object2 = { b: 2 };
const object3 = { c: 3 };

const objectMerge = Object.assign({}, object1, object2, object3); 
console.log(objectMerge) //{ a: 1, b: 2, c:3 }

Jako pierwszy parametr przekazujemy pusty obiekt, który stanie się bazą do "rozbudowy". Gdybyśmy go pominęli, jako że object1 został zadeklarowany przy użyciu słowa kluczowego const, zostanie wyrzucony błąd:

const object1 = { a: 1 };
const object2 = { b: 2 };
const object3 = { c: 3 };

const objectMerge = Object.assign(object1, object2, object3); 
//SyntaxError: Identifier 'object1' has already been declared}

Gdybyśmy jednak potrzebowali nadpisać object1, wystarczy zamiana const na let:

let object1 = { a: 1 };
const object2 = { b: 2 };
const object3 = { c: 3 };

Object.assign(object1, object2, object3); 
console.log(object1) //{ a: 1, b: 2, c:3 }

Klonowanie obiektów

Jak można się łątwo domyślić kopiowanie obiektów za pomocą Object.assign będzie wyglądało tak:

const myObject = { preciousValue: 42 };
const clonedObject = Object.assign({}, myObject);

console.log(clonedObject) //{ preciousValue: 42 }

Nadpisywanie danych obiektu

Najciekawszą możliwością, którą daje nam Object.assign wydaje się być nadpisywanie danych obiektu. Przypisywanie kolejnych właściwości do obiektu w funkcji Object.assign odbywa się od lewej do prawej. Jeśli więc kolejny obiekt przekazany do funkcji posiada właściwość, która istnieje w którymś z poprzedników, zostanie ona nadpisana:

const objectA = { a: 1, b: 1, c: 1};
const objectC = { c: 3 };

const objectMerge = Object.assign({}, objectA, { b: 2, c: 2 }, objectC);
console.log(objectMerge); //{ a: 1, b: 2, c:3 }