ES9 / ECMAScript 2018: Object Rest/Spread Properties and Asynchronous Iteration

Advanced JavaScript primitives. We analyze object destructuring, async iteration loops, and regex changes.

VP
SHIVAM ITCS
·10 June 2018·10 min read·1 views

Technical Overview & Strategic Context

While ES6 introduced rest and spread operators (...) for arrays, applying these operators to objects required using third-party utility libraries or Object.assign(). The finalization of the ECMAScript 2018 (ES9) standard in mid-2018 resolved this by introducing Object Rest/Spread properties. This release also introduced asynchronous iteration (for await...of), allowing developers to loop over asynchronous data sources (like database streams or API pages) asynchronously, simplifying data ingestion.

Architectural Principle: Use object rest/spread syntax to copy or destructure object properties immutably. Leverage asynchronous iteration to stream data chunks without blocking runtime loops.

Core Concepts & Architectural Blueprint

Object rest/spread allows developers to extract specific properties from an object and collect the rest into a new object structure. Asynchronous iteration introduces the for await...of loop, which works with async iterables. Instead of loading an entire stream into memory, the loop pauses execution until each data chunk resolves, keeping memory footprint low.

Performance & Capability Comparison

Syntax PrimitivesPre-ES9 Standard PatternES9 Standard PatternDeveloper Benefit
Object CloneObject.assign({}, original, updates)const copy = { ...original, ...updates }Simplifies state modifications
Object RestManual loop or delete keywordconst { a, ...rest } = objectSimplifies object destructuring
Async StreamsChained promises / callback loopsfor await (const chunk of stream)Enables non-blocking data streams

Implementation & Code Pattern

To implement asynchronous iteration and object destructuring using ES9 standards, follow these conventions:

  • Use rest syntax (const { id, ...details }) to extract properties safely.
  • Use spread operators ({ ...defaults, override }) to merge objects immutably.
  • Declare asynchronous loops using the for await...of syntax structure.
  • Verify target runtime support (Node 10+ or Chrome 64+) before execution.
javascriptcode
// ES9 Object Rest/Spread and Asynchronous Iteration (2018)
const student = { id: 101, name: "Vijay", gpa: 3.8, status: "Active" };

// Destructure object using Rest syntax
const { gpa, ...publicProfile } = student;
console.log(publicProfile); // Output: { id: 101, name: "Vijay", status: "Active" }

// Simulate asynchronous stream reader using Async Generators
async function* streamNumbers() {
  yield new Promise(res => setTimeout(() => res(10), 100));
  yield new Promise(res => setTimeout(() => res(20), 100));
}

async function runStream() {
  // Loop asynchronously over stream events
  for await (const val of streamNumbers()) {
    console.log("Stream value: " + val);
  }
}
runStream();

Operational Governance & Future Outlook

ECMAScript 2018's introduction of object rest/spread properties and asynchronous iteration simplified JavaScript data transformations and stream processing, helping developers write cleaner, more performant code.

VP
Vijay Paliwal
Founder, SHIVAM ITCS · 18+ years enterprise & AI engineering
MCA · Ex-HiveGPT USA · Ex-Social27 Seattle
ES9 / ECMAScript 2018: Object Rest/Spread Properties and Asynchronous Iteration | SHIVAM ITCS Blog | SHIVAM ITCS