What's New in JavaScript ES2023

ECMAScript and JavaScript are related but not identical. ECMAScript is a standard for creating scripting languages, while JavaScript is a scripting language that conforms to the ECMAScript standard.

ECMAScript 2023 (ES2023) is the latest version of the ECMAScript standard that will be finalized in June 2023. It introduces some new features and improvements that JavaScript will conform to, such as:

  • New array copying methods that return a copy of the array instead of mutating it in place. These methods are toSorted, toReversed, toSpliced, and with.
  • Support for Symbol keys in WeakMap objects, which allow storing weak references to objects that can be garbage collected.
  • Hashbang syntax that allows specifying which interpreter to use for executing a JavaScript file, such as Node.js.
  • findLast and findLastIndex methods for arrays and typed arrays that search for an element from the end of the array.

Change Array by copy

Provides additional methods on Array.prototype and TypedArray.prototype to enable changes on the array by returning a new copy of it with the change.

  • Array.prototype.toReversed() -> Array
  • Array.prototype.toSorted(compareFn) -> Array
  • Array.prototype.toSpliced(start, deleteCount, ...items) -> Array
  • Array.prototype.with(index, value) -> Array
  • TypedArray.prototype.toReversed() -> TypedArray
  • TypedArray.prototype.toSorted(compareFn) -> TypedArray
  • TypedArray.prototype.with(index, value) -> TypedArray
const sequence = [1, 2, 3];
sequence.toReversed(); // => [3, 2, 1]
sequence; // => [1, 2, 3]

const outOfOrder = new Uint8Array([3, 1, 2]);
outOfOrder.toSorted(); // => Uint8Array [1, 2, 3]
outOfOrder; // => Uint8Array [3, 1, 2]

const correctionNeeded = [1, 1, 3];
correctionNeeded.with(1, 2); // => [1, 2, 3]
correctionNeeded; // => [1, 1, 3]

Symbols as WeakMap keys

Extending the WeakMap to allow usage of unique Symbols as keys. Instead of requiring creating a new object to be only used as a key, a symbol would provide more clarity for the ergonomics of a WeakMap and the proper roles of its keys and mapped items.

const weak = new WeakMap();

// Pun not intended: being a symbol makes it become a more symbolic key
const key = Symbol('my ref');
const someObject = { /* data data data */ };

weak.set(key, someObject);

Hashbang

A hashbang comment behaves exactly like a single line-only (//) comment, except that it begins with #! and is only valid at the absolute start of a script or module. Note also that no whitespace of any kind is permitted before the #!. The comment consists of all the characters after #! up to the end of the first line; only one such comment is permitted.

Hashbang comments in JavaScript resemble shebangs in Unix which provide the path to a specific JavaScript interpreter that you want to use to execute the script.

#!/usr/bin/env node
// in the Module Goal
export {};
console.log(1);

Array find from last

Add new findLast() and findLastIndex() methods to array and typed array.

The findLastIndex() method iterates the array in reverse order and returns the index of the first element that satisfies the provided testing function. If no elements satisfy the testing function, -1 is returned.

The findLast() method iterates the array in reverse order and returns the value of the first element that satisfies the provided testing function. If no elements satisfy the testing function, undefined is returned.

const array = [{ value: 1 }, { value: 2 }, { value: 3 }, { value: 4 }];

array.findLast(n => n.value % 2 === 1); // { value: 3 }
array.findLastIndex(n => n.value % 2 === 1); // 2
array.findLastIndex(n => n.value === 42); // -1