The ECMAScript specification (ECMAScript Spec) is a standardized specification developed by Brendan Eich for the Javascript programming language.

This specification ensures that javascript behaves the same across platforms where javascript runs (Browser engines, Node). Software engineers, language designers, and their like often submit proposals to the ECMAScript Spec. These proposals pass through five stages (stages 0 to 4) of development and evaluation by the TC39 (Technical Committee 39), the community responsible for the evolution of ECMAScript, before they are added to the ECMAScript spec.

This article will explore some interesting ECMA Spec proposals that have reached stage 4 and may be added to the next ECMAScript Spec release. Shall we?

Array Grouping

If you are familiar with the Lodash groupBy method or the SQL GROUP BY clause, you’d easily understand what this proposal aims to achieve. This proposal seeks to give ECMAScript the ability to combine data into groups.

This groupBy method would be accessible as properties in the Object and Map data structure. For example, say you want to group an array of objects based on the type property; you could do this using the groupBy method.

const animalsAndPersons = [

{ name: "Bingo", type: "animal" },

{ name: "John", type: "person" },

{ name: "Jane", type: "person" }

]

//WITHOUT GROUPBY METHOD

animalsAndPersons.reduce((result, item) => {

if (!result[item.type]) result[item.type] = [];

result[item.type].push(item);

return result;

}, {});

// WITH GROUPBY METHOD

Object.groupBy(animalsAndPersons, (animalOrPerson) => {

return animalOrPerson.type === "animal" ? "animal" : "person"

});

// This would return an object based on the callback condition

/*

=> {

animal: [{ name: "Bingo", type: "animal" }],

person: [

{ name: "John", type: "person" },

{ name: "Jane", type: "person" },

],

}

- /

The above code sample uses the groupBy method to group an array of animals and persons into their respective groups. This would be a wonderful addition to the ECMA Spec as it would make it a little straightforward. This method also has a polyfill available here if you’d like to play around with it

Decorators

Decorators are functions that allow you to modify or add behavior to classes, functions, or methods without altering the original code. Although Javascript developers have been using this through transpilers like Babel and Typescript, It would be interesting to keep an eye on this proposal as it would provide a standard syntax for decorators to Javascript.

Change Array by Copy

This proposal provides array methods that make changes to arrays without mutating the original array. It returns a copy of the array containing the changes. The change array copy proposal is finished and has been merged to the ECMAScript spec and is available in ES2023.

It provides methods to sort, reverse and change array data without mutating the array these data are contained in but returns a new copy of the array with the change. Here is an example using the toReversed method

// USING reverse METHOD
const arr1 = [1, 2, 3, 4];
const reversed1 = arr1.reverse();
console.log("reversed =>", reversed1, "original =>", arr1);
// reversed => [4, 3, 2, 1] original => [4, 3, 2, 1]
// Mutates the original array

// USING toReversed METHOD
const arr2 = [1, 2, 3, 4];
const reversed2 = arr2.toReversed();
console.log("reversed =>", reversed2, "original =>", arr2);
// reversed => [4, 3, 2, 1] original => [1, 2, 3, 4]
// Creates a new copy without mutating the original array

Temporal

This proposal aims to be more consistent and reliable than the current javascript Date object. It also fixes the mutability with the Date object, adds more time zones other than UTC or users’ local time, and has many more exciting features.

Here is an example of Temporal immutability compared to the Date object using a Temporal polypill

//Testing Temporals Immutability

import "temporal-polyfill/global";

const zonedTimeTemporal = Temporal.Now.zonedDateTimeISO();
const zonedTimeDate = new Date();

console.log(zonedTimeTemporal.toString()); // 2023-10-14T22:25:27.976+01:00[Africa/Lagos]
console.log(zonedTimeDate.toISOString()); // 2023-10-14T21:30:05.323Z

try {
     zonedTimeTemporal.year = 2030;
} catch (error) {
     console.log(error.message); // Error: Attempted to assign to readonly property.
}

try {
     zonedTimeDate.setFullYear(2030);
} catch (error) {
     console.log(error.message);
}

console.log(zonedTimeDate.getFullYear()); // 2030 (year value change)

The immutability of Temporal helps to prevent unexpected modifications to the date/time data.

A lot of exciting features will be released with Temporal, which would fix issues currently present in  Javascript’s Date object. You can check the Temporal documentation for more exciting features.

Other Interesting Proposals

• Set Methods
• Float16 on TypedArrays, DataView
• Import Attributes

You can find more proposals in the official ECMAScript proposal repo here.

Thank you for taking time out to learn about the exciting things coming to Javascript. I hope you enjoyed reading this and learned a thing or two.