Top-Level Await, Array Grouping, and the Latest ES Features

JavaScript ships new features every year through the TC39 proposal process (stages 0 through 4), and several recent additions solve problems that used to require workarounds or extra libraries.

// Top-level await (ES2022) — works directly in a module, no wrapper function needed
const data = await fetch("/api/config").then(r => r.json());

const items = [1, 2, 3];
items.at(-1); // 3 — negative indexing (ES2022)

const clone = structuredClone({ a: 1, nested: { b: 2 } }); // deep clone, ES2022, no libraries needed

const grouped = Object.groupBy(
  [{ type: "fruit", name: "apple" }, { type: "veg", name: "carrot" }],
  item => item.type
); // ES2024: { fruit: [...], veg: [...] }

Top-level await (ES2022) lets a module await a promise directly, without wrapping the code in an async function — handy for one-off setup code that needs to run before the rest of a module executes. Array.prototype.at() (ES2022) accepts negative indices for cleaner "last element" access. structuredClone() (ES2022, available as a global in browsers and Node) performs a true deep clone of most JavaScript values without needing a library like Lodash. Object.groupBy() (ES2024) groups an array's items into an object keyed by whatever a callback function returns.

Because JavaScript evolves continuously, the most reliable way to see what's coming next — and how stable a proposed feature is — is to check the TC39 proposals repository directly rather than relying on any single tutorial.