After completing this lesson, you'll be confident doing all three of the following:

• ▸✅ New syntax like Array.at(-1) · structuredClone · Object.hasOwn
• ▸✅ Top-level await + Error cause option
• ▸✅ When Object.groupBy / using (ES2024) were introduced

Keep these learning goals as a checklist, and close the lesson once you can answer all of them.

Why you need to know this

In 2025, 30% of JavaScript code generated by AI uses ES2022 or later syntax. If you don't know it, you stop reading and search — wasting both tokens and time.

1. Array.at(-1) — Last element (ES2022)

const arr = [10, 20, 30];
console.log(arr.at(-1));            // 30   ← 1st from the end
console.log(arr.at(-2));            // 20   ← 2nd from the end
console.log(arr[arr.length - 1]);   // 30   ← old way (requires length - 1 calculation)
//
// 💡 Supports negative indices like Python's arr[-1] → shorter code

Access elements from the end using negative indices. Same convenience as Python's arr[-1].

2. Object.hasOwn() — A safer hasOwnProperty (ES2022)

Object.hasOwn(obj, 'key');     // ✅ recommended
obj.hasOwnProperty('key');     // ❌ old way — breaks if the object overrides hasOwnProperty

The pattern automatically recommended by linters (ESLint).

3. structuredClone() — The standard for deep copying (Node 17+)

const deep = structuredClone(original);

Fixes the limitations of JSON.parse(JSON.stringify(...)) (loss of Date, Map, Set). A built-in function — no library needed.

4. Top-level await (ES2022 modules)

// ESM module top level
const data = await fetch('/config.json').then(r => r.json());
export default data;

You can use await at the top level of a module without wrapping it in an async function. Often used together with dynamic import.

5. Error cause (ES2022)

throw new Error('Failed to fetch product', { cause: originalError });

6. Array.fromAsync() (ES2024)

const urls = ['/a', '/b', '/c'];
const results = await Array.fromAsync(
    urls,
    async url => (await fetch(url)).json()
);

Resolves and collects a array of Promises sequentially. A cleaner form of Promise.all + map (though note it processes sequentially, so use Promise.all for parallel work).

7. Object.groupBy() (ES2024)

const arr = [
    { type: 'fruit', name: 'apple' },
    { type: 'veg',   name: 'carrot' },
    { type: 'fruit', name: 'banana' }
];

// 🪣 Groups by the result of the callback passed as the second argument, used as a "key"
const grouped = Object.groupBy(arr, item => item.type);
console.log(grouped);
// {
//   fruit: [ { type: 'fruit', name: 'apple' }, { type: 'fruit', name: 'banana' } ],
//   veg:   [ { type: 'veg',   name: 'carrot' } ]
// }

Lodash _.groupBy absorbed into the standard library. One fewer library dependency.

8. using / await using (TC39 Stage 4)

{
    using db = await openDB();
    // db[Symbol.dispose]() is called automatically at the end of the block
}

The resource cleanup pattern of try-finally at the language level. Same concept as C# using and Python with. Available from TypeScript 5.2+.

Summary

Knowing these 8 features means you can read almost all new syntax in AI-generated code without stopping. You'll never need to ask AI "what is this syntax?" again — saving your tokens directly.

Knowing the concepts in this lesson lets you give AI specific instructions. Instead of a vague "fix this," you make requests with vocabulary — that's where token savings begin.

• ▸"Apply modern syntax like Array.at(-1) · structuredClone · Object.hasOwn to this code"
• ▸"Replace this deep copy with structuredClone"

Why this saves tokens

Without understanding the concepts, you have to ask "what is that?" again after receiving an AI response. That follow-up question is what eats up tokens. Learn a concept once, and the conversation ends in one go.