5 Exciting JavaScript Features Set to Transform 2024

ECMAScript Update The ECMAScript committee (TC39) plans a new version around early June 2024, following the regular annual release cycle that began with ES6.

New proposals must pass four stages of review and voting before becoming part of the language, ensuring backward compatibility and preventing breaking changes.

Temporal API

The Temporal proposal introduces a global object to replace the legacy Date, offering immutable date‑time types and eliminating common pitfalls such as zero‑based months.

const olympics = Temporal.Instant.from('2024-07-26T20:24:00+01:00');
new Temporal.PlainDate(2024, 7, 26);
Temporal.PlainDate.from('2024-07-26');
new Temporal.PlainTime(20, 24, 0);
Temporal.PlainTime.from('20:24:00');
const valentinesDay = Temporal.PlainMonthDay.from({ month: 2, day: 14 });
const march = Temporal.PlainYearMonth.from({ month: 3, year: 2024 });
const today = Temporal.Now.plainDateISO();
const lastWeek = today.subtract({ days: 7 });
const nextWeek = today.add({ days: 7 });
olympics.until().days;
valentinesDay.since().hours;

Temporal objects also expose properties such as hour, dayOfWeek, daysInMonth, and provide a compare method for sorting.

Pipe Operator

The pipeline operator ( |>) lets you feed the output of one function directly into the next, improving readability over nested calls.

const exclaim = string => string + "!!!";
const listen = string => "Listen up! " + string;
const uppercase = string => string.toUpperCase();
const text = "Hello World";
uppercase(exclaim(listen(text))) // → "LISTEN UP! HELLO WORLD!!!"
text |> listen(%) |> exclaim(%) |> uppercase(%);

Although still in Stage 2, the operator is already implemented in Babel 7.15.

Record and Tuple

Records and Tuples introduce deep immutability to JavaScript. Tuples are ordered, immutable lists created with a leading #, while Records are immutable key‑value maps also prefixed with #.

const heroes = #["Batman", "Superman", "Wonder Woman"];
const traitors = #{ diane: false, paul: true, zac: false, harry: true };
traitors.paul; // → true
heroes[1]; // → "Superman"
heroes === #["Batman", "Superman", "Wonder Woman"]; // → true
traitors === #{ paul: true, harry: true, diane: false, zac: false }; // → true

Both structures support strict equality checks, and their immutability enables safe structural sharing.

RegExp /v Flag

The v flag extends the existing u flag, adding set operations and case‑insensitive matching improvements.

const isEmoji = /^\p{RGI_Emoji}$/v;
isEmoji.test("💚"); // true
const isNotHeartEmoji = /^[\p{RGI_Emoji_Tag_Sequence}--\q{💜💚♥️💙🖤💛🤍🤎}]$/v;
isNotHeartEmoji.test("💚"); // false
const GreekLetters = /[\p{Script_Extensions=Greek}&&\p{Letter}]/v;
GreekLetters.test('π'); // true

The flag reached Stage 4 in 2023 and is already supported in major browsers, making it a strong candidate for ES2024.

Decorator

Decorators provide a native way to augment classes and class members with additional behavior, similar to patterns in Python and TypeScript.

@validation
class FormComponent {
  // class body
}
function validation(target) {
  // validation logic
}
class FormComponent {
  @validation
  submit(data) {
    // method body
  }
}

Currently in Stage 3 and available in Babel, decorators allow developers to apply cross‑cutting concerns such as validation or logging without modifying core class logic.

These five proposals—Temporal, Pipe Operator, Record & Tuple, RegExp v flag, and Decorators—represent the most exciting additions to JavaScript expected in 2024, promising more robust, expressive, and immutable code.