Destructuring and Spread

Object Spread

Build a new object by spreading fields.

object-spread Object spread copies fields into a new object literal. Later fields can add or replace values while keeping the result explicit.

Object Spread

stock
spread_object.js
Replay: real traced execution (multi-file project)
const stock = 3;
const summary = JSON.stringify({
  item: "pen",
  ...{ stock: stock },
});
const hasStock = stock > 0;

console.log("summary=" + summary);
console.log("hasStock=" + hasStock);

const stock = 0;
const summary = JSON.stringify({
  item: "pen",
  ...{ stock: stock },
});
const hasStock = stock > 0;

console.log("summary=" + summary);
console.log("hasStock=" + hasStock);

const stock = 8;
const summary = JSON.stringify({
  item: "pen",
  ...{ stock: stock },
});
const hasStock = stock > 0;

console.log("summary=" + summary);
console.log("hasStock=" + hasStock);

  1. stock ← 3, summary ← {"item":"pen","stock":3}, hasStock ← true

    1const stock→ 3 = 3; //@stock=0, 82const summary→ {"item":"pen","stock":3} = JSON.stringify({3  item: "pen",4  ...{ stock: stock3 },5});6const hasStock→ true = stock→ 3 > 0;78console.log("summary=" + summary{"item":"pen","stock":3});9console.log("hasStock=" + hasStocktrue);
    outputsummary={"item":"pen","stock":3}
hasStock=true

  1. stock ← 0, summary ← {"item":"pen","stock":0}, hasStock ← false

    1const stock→ 0 = 0;2const summary→ {"item":"pen","stock":0} = JSON.stringify({3  item: "pen",4  ...{ stock: stock0 },5});6const hasStock→ false = stock→ 0 > 0;78console.log("summary=" + summary{"item":"pen","stock":0});9console.log("hasStock=" + hasStockfalse);
    outputsummary={"item":"pen","stock":0}
hasStock=false

  1. stock ← 8, summary ← {"item":"pen","stock":8}, hasStock ← true

    1const stock→ 8 = 8;2const summary→ {"item":"pen","stock":8} = JSON.stringify({3  item: "pen",4  ...{ stock: stock8 },5});6const hasStock→ true = stock→ 8 > 0;78console.log("summary=" + summary{"item":"pen","stock":8});9console.log("hasStock=" + hasStocktrue);
    outputsummary={"item":"pen","stock":8}
hasStock=true