Sloučit vlastnosti objektu s operátorem Spread

Minulý týden jsem napsal 6 skvělých použití operátora šíření, příspěvek podrobně popisující, jak úžasný je operátor šíření (... ) je pro práci s poli a dalšími iterovatelnými objekty. Jako vždy se moji čtenáři ozvali s několika dalšími skvělými způsoby využití, na které byste se měli podívat v komentářích. A samozřejmě, jakmile publikuji příspěvek, najdu další skvělé využití operátoru spread, zatímco si pohrávám s Babel a React: sloučení vlastností více objektů do jednoho objektu!

JavaScript

Všechny objekty, které chcete sloučit do jednoho, zabalte do složených závorek ({} ):

const person = { name: 'David Walsh', gender: 'Male' };
const tools = { computer: 'Mac', editor: 'Atom' };

const summary = {...person, ...tools};
/*
Object {
  "computer": "Mac",
  "editor": "Atom",
  "gender": "Male",
  "name": "David Walsh",
}
*/

Vytvoří se nový objekt obsahující všechny vlastnosti a hodnoty z objektů poskytnutých operátorem zbytek. Také si uvědomte, že ke sloučení můžete poskytnout libovolný počet objektů:

const person = { name: 'David Walsh', gender: 'Male' };
const tools = { computer: 'Mac', editor: 'Atom' };
const attributes = { handsomeness: 'Extreme', hair: 'Brown', eyes: 'Blue' };

const summary = {...person, ...tools, ...attributes};
/*
Object {
  "computer": "Mac",
  "editor": "Atom",
  "eyes": "Blue",
  "gender": "Male",
  "hair": "Brown",
  "handsomeness": "Extreme",
  "name": "David Walsh",
}
*/

V případě kolize klíčů zvítězí hodnota objektu zcela vpravo (posledního):

const person1 = { name: 'David Walsh', age: 33 };
const person2 = { name: 'David Walsh Jr.', role: 'kid' };

const merged = {...person1, ...person2}
/*
Object {
  "name": "David Walsh Jr.",
  "age": 33,
  "role": "kid",
}
*/

Líbí se mi, jak snadné je slučování objektů pomocí operátoru spread. Můžete použít Object.assign Chcete-li dosáhnout stejného výkonu, ale operátor šíření věci trochu zkrátí, pokud vám nevadí trochu méně popisná syntaxe!

Poznámka: Tato syntaxe zatím není podporována všemi prohlížeči, ale můžete použít Babel s transform-object-rest-spread plugin umožňující sloučení objektů s operátorem spread.