Here are some of the latest and most useful JavaScript methods that have been introduced in recent versions of ECMAScript (ES2020, ES2021, ES2022, and ES2023):
1. String.prototype.replaceAll()
Replaces all occurrences of a substring in a string.
const str = 'foo bar foo';
const newStr = str.replaceAll('foo', 'baz');
console.log(newStr); // baz bar baz
2. Promise.allSettled()
Returns a promise that resolves after all of the given promises have either resolved or rejected.
const promises = [
Promise.resolve(1),
Promise.reject('error'),
Promise.resolve(3)
];
Promise.allSettled(promises).then((results) => {
results.forEach((result) => console.log(result.status));
});
// fulfilled
// rejected
// fulfilled
3. Logical Assignment Operators
Combines logical operations with assignment.
let a = 1;
a ||= 2; // a = a || 2
console.log(a); // 1
let b = 0;
b &&= 2; // b = b && 2
console.log(b); // 0
let c = null;
c ??= 3; // c = c ?? 3
console.log(c); // 3
4. Nullish Coalescing Operator (??)
Provides a default value when the left-hand side is null
or undefined
.
const foo = null ?? 'default value';
console.log(foo); // default value
5. Optional Chaining (?.)
Allows safe access to deeply nested properties.
const user = { address: { street: 'Main St' } };
const street = user?.address?.street;
console.log(street); // Main St
6. BigInt
A built-in object that provides a way to represent whole numbers larger than 2^53 - 1
.
const largeNumber = BigInt(123456789012345678901234567890);
console.log(largeNumber); // 123456789012345678901234567890n
7. WeakRef
and FinalizationRegistry
Allows creation of weak references to objects and registers a cleanup callback for when the object is garbage collected.
let target = { data: 'some data' };
const weakRef = new WeakRef(target);
const registry = new FinalizationRegistry((heldValue) => {
console.log(`Cleaned up ${heldValue}`);
});
registry.register(target, 'some data');
target = null;
// Later, when garbage collected, "Cleaned up some data" will be logged.
8. Array.prototype.at()
Allows relative indexing in arrays.
const array = [10, 20, 30, 40];
console.log(array.at(-1)); // 40
9. Object.hasOwn()
A safer alternative to Object.prototype.hasOwnProperty
.
const obj = { key: 'value' };
console.log(Object.hasOwn(obj, 'key')); // true
10. Top-level await
Allows using await
at the top level of modules.
// In a module file (e.g., module.mjs)
const data = await fetchData();
console.log(data);
11. Relative indexing method for Strings
The at()
method is also available for strings.
const str = 'hello';
console.log(str.at(-1)); // 'o'
12. Object.fromEntries()
Transforms a list of key-value pairs into an object.
const entries = new Map([
['foo', 'bar'],
['baz', 42]
]);
const obj = Object.fromEntries(entries);
console.log(obj); // { foo: 'bar', baz: 42 }
These methods and operators provide more flexibility and efficiency in handling common programming tasks.
Top comments (0)