What’s New in JavaScript? A Deep Dive into TC39’s Latest Proposals

Due to the pandemic, TC39 meetings increased, leading to several proposals gaining attention.

Realms

The new Realms proposal restricts value exchange between realms to primitive values and Callables. Functions crossing realms are wrapped, exposing only call capability. Object bridging via https://github.com/caridy/irealm can share JSON but not ArrayBuffer/TypedArray. Host globals hook allows hosts like browsers to inject APIs (e.g., TextEncoder), making realms host‑dependent. The proposal has not reached Stage 3 consensus.

RegExp Match Indices

Current RegExp.prototype.exec returns capture groups but not their start/end indices. The proposal adds an indices property to the result array, providing precise positions. Example code demonstrates usage and shows that the feature is available in Chrome 91 and Firefox 88.

// Create a regex with index support
const re1 = /a+(?<Z>z)?/d;
const s1 = "xaaaz";
const m1 = re1.exec(s1);
m1.indices[0][0] === 1; // start of full match
m1.indices[0][1] === 5; // end of full match
s1.slice(...m1.indices[0]) === "aaaz";
m1.indices[1][0] === 4; // start of group Z
m1.indices[1][1] === 5;
s1.slice(...m1.indices[1]) === "z";
m1.indices.groups["Z"][0] === 4;
m1.indices.groups["Z"][1] === 5;

Top‑level await

Top‑level await removes the need for IIAFEs. It allows await directly in module bodies, simplifying asynchronous initialization. The proposal works in ECMAScript modules on Chrome 89 and Node.js 14.8.0, but not in CommonJS or non‑module scripts. Unlike IIAFEs, top‑level await blocks dependent module evaluation, which can cause page‑load delays.

// a.mjs
import { setTimeout } from 'timers/promises';
let value;
export { value };
export default (async () => {
  await setTimeout(1000);
  value = 'foobar';
})();

// b.mjs
import promise, { value } from "./a.mjs";
export function outputValue() { return value; }
promise.then(() => console.log(outputValue()));

Accessible Object.hasOwnProperty

The proposal adds Object.hasOwn(object, prop) to avoid unsafe calls to obj.hasOwnProperty when the method might be overridden. It provides a reliable way to check own properties.

let hasOwn = Object.prototype.hasOwnProperty;
if (hasOwn.call(object, "foo")) {
  console.log("has property foo");
}

Resizable and growable ArrayBuffers

The proposal introduces a maximumByteLength option for ArrayBuffer and SharedArrayBuffer, enabling resizable buffers. It also adds a grow(newByteLength) method for shared buffers. Example shows creating, resizing, and transferring a resizable buffer.

let rab = new ArrayBuffer(1024, { maximumByteLength: 1024 ** 2 });
assert(rab.byteLength === 1024);
rab.resize(rab.byteLength * 2);
let ab = rab.transfer(1024); // rab becomes detached

Intl.DisplayNames V2

The extension expands Intl.DisplayNames to support calendar names, date‑time field names, and dialect display options, enabling richer locale‑aware labeling.

let dn = new Intl.DisplayNames("zh-Hans", {type: "calendar"});
dn.of("chinese"); // "农历"
dn = new Intl.DisplayNames("zh-Hans", {type: "dateTimeField"});
dn.of("month"); // "月"

Intl Extend TimeZoneName Option

The proposal adds new values to timeZoneName in Intl.DateTimeFormat, such as shortOffset, longWall, giving developers finer control over time‑zone formatting.

["short","long","shortOffset","longOffset","shortWall","longWall"].forEach(name => {
  console.log(new Date().toLocaleTimeString("zh-Hans", {timeZoneName: name}));
});

RegExp Set Notation

The proposal introduces set notation for character classes, allowing intersection ( [A&&B]), subtraction ( [A--B]), and nested sets, simplifying complex Unicode regexes.

// subtraction
[ A--B ]
// intersection
[ A&&B ]
// nested
[ A--[0-9] ]

The JavaScript Chinese Interest Group (JSCIG) invites contributors to discuss these proposals on GitHub.