What’s Next for JavaScript? Inside TC39’s Latest Proposals and Stage Progress

TC39 2020 Final Meeting Overview

The meeting concluded without any proposal advancing from Stage 2 to Stage 3 or from Stage 3 to Stage 4.

Stage 1 → Stage 2 Requirement

Advancing a proposal from Stage 1 to Stage 2 requires a draft of the full specification text.

Error‑Cause Proposal

The cause option adds an optional parameter to the Error constructor that can hold any JavaScript value, mirroring similar features in C#, Java, and Python. It enables devtools to display the cause automatically, improving debugging experience.

try {
  return await fetch('//unintelligible-url-a')
    .catch(err => {
      throw new Error('Download raw resource failed', err);
    });
} catch (err) {
  console.log(err);
  console.log('Caused by', err.cause);
}

Stage 0 → Stage 1 Requirements

Find a TC39 champion.

Define the problem, need, and rough solution.

Provide examples.

Discuss API shape, algorithms, semantics, and implementation risks.

JavaScript Module Blocks Proposal

Current approaches to share code across workers (separate files, string‑based execution, function‑to‑string) are inefficient or unsafe. The proposal introduces isolated module blocks that are parsed once and can be imported by workers.

let workerCode = module {
  onmessage = function({ data }) {
    let mod = await import(data);
    postMessage(mod.fn());
  };
};
let worker = new Worker(workerCode, { type: 'module' });
worker.onmessage = ({ data }) => alert(data);
worker.postMessage(module { export function fn() { return 'hello!' } });

Extensions Proposal

Revives ideas from the abandoned Bind Operator, adding local‑scope extensions, accessor syntax, and a dedicated namespace to avoid clashes. Example extensions include ::toSet, ::allDivs, and ::flatMap.

// Extend collection types
const ::toSet = function () { return new Set(this) };
const ::allDivs = function {
  get() { return this.querySelectorAll('div') }
};
const ::flatMap = Array.prototype.flatMap;
const ::size = Object.getOwnPropertyDescriptor(Set.prototype, 'size');

let classCount = document
  ::allDivs
  ::flatMap(el => el.classList)
  ::toSet()
  ::size;

The proposal also defines namespace‑based usage ( obj::namespace:extension) and aligns the precedence of :: with .. Compared with the Pipeline Operator, :: passes the left operand as this, enabling patterns such as async pipe extensions.

const ::pipe = fn => fn(this);
let result = "hello"
  ::pipe(capitalize)
  ::pipe(exclaim); // "Hello!"

Grouped Accessor Proposal

Allows getters and setters to be declared together in a concise syntax and supports decorator application on the combined accessor.

class C {
  x {
    get() { … }
    set(value) { … }
  }
}

@JackWorks: What would JavaScript look like if all TC39 proposals were merged?