New Features in ES15 (2024) with Code Examples

ECMAScript 15 (ES15) is the latest version of the JavaScript programming language, released in 2024. It introduces several new features that aim to enhance code readability, maintainability, and performance. Here is my top 5 features that i believe you should be aware of:

1. Class Fields and Static Properties

One of the most significant additions to ES15 is the ability to define class fields and static properties directly within the class body. This eliminates the need for constructor functions to initialize properties, leading to cleaner and more concise code.

Example:

class Person {
  name;
  age;

  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
}

2. WeakRefs

WeakRefs provide a mechanism to create weak references to objects, preventing memory leaks. This is particularly useful when dealing with objects that are no longer needed but might be kept alive due to unintentional references.

Example:

const obj = { name: "John" };
const weakRef = new WeakRef(obj);

// ... (later)

obj = null; // obj is eligible for garbage collection

3. Import Assertions

Import assertions allow you to specify the module format of an imported module, ensuring compatibility with different module systems. This can be helpful when dealing with modules from various sources.

Example:

import { myFunction } from "./myModule.js" assert { type: "json" };

4. RegExp Match Indices

The indices property of regular expression matches now provides more information about the indices of matched substrings. This can be useful for more precise string manipulation.

Example:

const regex = /hello/;
const match = regex.exec("hello world");

console.log(match.indices); // Output: [[0, 5]]

5. Array.prototype.at()

The at() method provides a more concise way to access elements at specific positions in an array, including negative indices.

Example:

const fruits = ["apple", "banana", "cherry"];

console.log(fruits.at(1)); // Output: "banana"
console.log(fruits.at(-1)); // Output: "cherry"

These new features in ES15 offer significant improvements to the JavaScript language, making it more efficient and expressive. By understanding and utilizing these features, you can write cleaner, more maintainable, and performant JavaScript code.