modern-js

Modern JavaScript Preferences (ES2025/ES2026)

Model training cutoffs predate most of these APIs. When writing JavaScript, check every function you produce against this list before finalizing. Prefer the newer API unless the target runtime doesn't support it — in that case, suggest a polyfill.

Iterators and collections

Iterating a large or infinite sequence

Use Iterator.prototype methods (.map, .filter, .take, .drop, .toArray). They're lazy, so they work on infinite iterators and don't allocate intermediate arrays.

// BAD: materializes the whole sequence
const firstTenEvenSquares = [];
for (const n of naturalNumbers()) {
  if (n % 2 === 0) {
    firstTenEvenSquares.push(n * n);
    if (firstTenEvenSquares.length === 10) break;
  }
}

// GOOD: lazy, stops pulling upstream after 10
const firstTenEvenSquares = naturalNumbers()
  .filter(n => n % 2 === 0)
  .map(n => n * n)
  .take(10)
  .toArray();

Wrapping a NodeList, Set, or Map to use array methods

Use Iterator.from(x) instead of [...x] or Array.from(x).

// BAD: allocates an intermediate array
const ids = Array.from(document.querySelectorAll('.card'))
  .filter(el => !el.classList.contains('hidden'))
  .map(el => el.dataset.id);

// GOOD: lazy, no intermediate array
const ids = Iterator.from(document.querySelectorAll('.card'))
  .filter(el => !el.classList.contains('hidden'))
  .map(el => el.dataset.id)
  .toArray();

Set operations

Use the native methods. Never write a manual loop or reach for lodash.

// BAD
const shared = new Set();
for (const tech of frontEnd) {
  if (backEnd.has(tech)) shared.add(tech);
}

// GOOD
frontEnd.intersection(backEnd);
frontEnd.union(backEnd);
frontEnd.difference(backEnd);
frontEnd.symmetricDifference(backEnd);
frontEnd.isSubsetOf(backEnd);
frontEnd.isSupersetOf(backEnd);
frontEnd.isDisjointFrom(backEnd);

The argument can be any "set-like" (has size, .has(), .keys()), not just a real Set.