The syntax that replaced the patterns you learned first
A reference for the modern language: optional chaining, nullish coalescing, the newer array methods and the async patterns that go with them.
| Syntax | Meaning |
|---|---|
a?.b?.c |
undefined instead of a TypeError on a missing link |
fn?.(arg) |
Call only if fn exists |
a ?? b |
b only when a is null or undefined — 0 and "" survive |
a ||= b |
Assign when falsy |
a ??= b |
Assign only when nullish |
const { a, b: c = 1, ...rest } = obj |
Destructure, rename, default, collect |
structuredClone(obj) |
A real deep clone — handles Dates, Maps and cycles |
| Method | Note |
|---|---|
arr.at(-1) |
Last element, without arr.length - 1 |
arr.toSorted() |
Sorts a COPY — .sort() mutates in place |
arr.toReversed(), arr.toSpliced() |
The other non-mutating twins |
arr.with(0, "x") |
A copy with one index replaced |
arr.findLast(fn) |
Search from the end |
arr.flatMap(fn) |
Map then flatten one level |
Object.groupBy(arr, fn) |
Group into an object by key |
| Combinator | Settles when | Use for |
|---|---|---|
Promise.all |
All fulfil, or any rejects | All-or-nothing work |
Promise.allSettled |
All settle, however they settle | Batch jobs where partial success is fine |
Promise.race |
The first to settle either way | Timeouts |
Promise.any |
The first to FULFIL | Redundant sources — try several mirrors |
The newer methods return a copy, so the source array survives — which is what makes them safe in reactive frameworks.
const users = [
{ name: 'Ada', score: 91 },
{ name: 'Linus', score: 78 },
{ name: 'Grace', score: 96 },
];
// Copy, not mutate — `users` is untouched
const ranked = users.toSorted((a, b) => b.score - a.score);
const top = ranked.at(0); // no ranked[ranked.length - 1] dance
const last = ranked.at(-1);
// Group without a reduce()
const byBand = Object.groupBy(users, (u) => (u.score >= 90 ? 'high' : 'rest'));
// Replace one index, immutably
const patched = users.with(1, { ...users[1], score: 80 });Whenever 0, "" or false are valid values. || treats all of them as missing and substitutes your default; ?? only does so for null and undefined.
sort() mutates the array in place, which in a reactive framework silently edits state you did not mean to touch. toSorted() returns a copy.