ECMAScript 2023 Highlights | The Features You Can't-Miss

ECMAScript, the scripting language that powers the web, is the standardized scripting language commonly known as JavaScript. It has consistently evolved to meet the ever-growing demands of web development. Each new version brings with it a range of new features and improvements that empower developers to write cleaner, more efficient code.

In the year 2023, ECMAScript 2023 made its grand entrance, introducing a slew of new features that left developers buzzing with excitement.

Features:

Let's dive into the world of ECMAScript 2023 and explore its groundbreaking innovations.

• Array find from last

• Hashbang Grammar

• Symbols as WeakMap keys

• Change Array by Copy

Array find from last

Finding an element in an array is a very common programming pattern. The .findLast() and .findLastIndex() are useful array methods that allow you to find the last element in an array that satisfies a given condition.

The .findLast() method returns the value of the last element in the array that matches the provided testing function. Here's an example:

const numbers = [1, 2, 3, 4, 5];

const lastEvenNumber = numbers.findLast((number) => number % 2 === 0);
console.log(lastEvenNumber); // Output: 4

On the other hand, the .findLastIndex() method returns the index of the last element in the array that satisfies the provided testing function. Here's an example:

const numbers = [1, 2, 3, 4, 5];

const lastIndex = numbers.findLastIndex((number) => number % 2 === 0);
console.log(lastIndex); // Output: 3

These methods are particularly useful when you need to find the last occurrence of a specific element or condition within an array.

Hashbang Grammar

Hashbang Grammar is a feature that allows JavaScript files to be executed as scripts in environments that support it, such as Unix-like operating systems. It enables the use of a special syntax called "hashbang" or "shebang" at the beginning of the file, followed by the path to the interpreter that should execute the script. Here's an example code snippet:

#!/usr/bin/env node

// in the Script Goal
'use strict';
console.log(1);

// in the Module Goal
export {};
console.log(1);

In this example, the hashbang #!/usr/bin/env node specifies that the script should be executed using the Node.js interpreter. When the file is run, the specified interpreter (in this case, Node.js) will execute the JavaScript code following the hashbang line.

Symbols as WeakMap keys

Symbols are unique and immutable values that can be used as property keys, providing a way to create non-enumerable properties. WeakMap is a built-in JavaScript data structure that allows objects to be used as keys. Unlike regular Maps, WeakMaps hold weak references to the keys, meaning that if there are no other references to the key objects, they can be garbage collected. This is useful for scenarios where you want to associate data with an object without preventing the object from being garbage collected.

Here's an example code snippet that demonstrates the usage of Symbols as WeakMap keys:

const wm = new WeakMap();

const key = Symbol('myKey');
const value = 'Some value';

wm.set(key, value);

console.log(wm.get(key)); // Output: Some value

In this example, we create a WeakMap instance called wm. We define a Symbol key and associate it with the value 'Some value' using the set() method. Later, we retrieve the value using the get() method and log it to the console.

Change Array by Copy

This proposal introduces the following function properties to Array.prototype:

• Array.prototype.toReversed() -> Array

• Array.prototype.toSorted(compareFn) -> Array

• Array.prototype.toSpliced(start, deleteCount, ...items) -> Array

• Array.prototype.with(index, value) -> Array

All of those methods keep the target Array untouched and returns a copy of it with the change performed instead.

toReversed, toSorted, and with will also be added to TypedArrays:

• 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]

What can we expect in 2024?

While the focus now is on the 2023 features, there are also important proposals for 2024. Although these are still in the early stages of approval, they promise exciting advancements for JavaScript.

Well-Formed Unicode Strings

The proposal is to define in ECMA-262 a method to verify if a given ECMAScript string is well-formed or not. In addition to improved performance, this method will also increase the clarity for readers of code where this test is being performed especially those without extensive Unicode or regular expression knowledge.

if (!someString.isWellFormed()) { 
    someString = someString.toWellFormed(); 
}

Atomics.waitAsync

Atomics.waitAsync, which an agent can use to wait on a shared memory location (to later be awoken by some agent calling Atomics.notify on that location) without waiting synchronously (ie, without blocking). Notably this API is useful in agents whose [[CanBlock]] attribute is false, such as the main thread of a web browser document, but the API is not restricted to such agents.

The API is promise-based. Very high performance is not a requirement, but good performance is desirable.

RegExp v flag with set notation + properties of strings

In ECMAScript regex character classes, this proposes to add syntax & semantics for the following set of operations:

• difference/subtraction (in A but not in B)

• intersection (in both A and B)

• nested character classes (needed to enable the above)
  

// difference/subtraction
[A--B]

// intersection
[A&&B]

// nested character class
[A--[0-9]]

In conclusion, ECMAScript 2023 ushers in a new era for JavaScript development. Its new features and enhancements empower developers to write cleaner, more expressive code, and improve the overall performance of their applications. As the web continues to evolve, ECMAScript 2023 ensures that JavaScript remains a versatile and powerful language that will shape the future of web development.

Resources:

https://github.com/tc39/proposals/blob/main/finished-proposals.md

If you liked the article and want to connect with me, you can now schedule a direct meeting with me : https://topmate.io/anishaswain