# JS Tip of the Day: ES2021 Preview

**URL:** <https://forum.kirupa.com/t/js-tip-of-the-day-es2021-preview/643632>\
**Category:** web dev\
**Created:** [July 22, 2020, 3:00pm UTC](https://forum.kirupa.com/t/js-tip-of-the-day-es2021-preview/643632 "2020-07-22T15:00:31Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![senocular](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/senocular/32/7217_2.png) [@senocular](https://forum.kirupa.com/u/senocular)\
**Post date:** [July 22, 2020, 3:00pm UTC](https://forum.kirupa.com/t/js-tip-of-the-day-es2021-preview/643632/1 "2020-07-22T15:00:31Z")

</div>

**ES2021 Preview**  
Version: ES2021  
Level: Beginner

This series of JavaScript tips started with a couple of new features that were introduced in ES2020. For this tip, the final tip in the series, we will take a look at a few of the features that have been finalized for the next release of the ECMAScript specification, ES2021. These include:

- Numeric Separators
- String.prototype.replaceAll()
- Promise.any()
- Logical Assignment Operators

* * *

Numeric Separators

We’ve already touched upon numeric separators in the [Numeric Literal Formats](http://forum.kirupa.com/t/js-tip-of-the-day-numeric-literal-formats/643150) tip. These are underscores that you can add to number literals to make them easier to read. Like comments, when the code is run, they’re ignored, but as a viewer of the source code, they can be useful in showing just how big a number is.

```javascript
let unknownSize = 1000000000;
let clearlyOneBillion = 1_000_000_000;

```

String.prototype.replaceAll()

Strings are getting a new replace function, `replaceAll()`. This works much like the existing `replace()` except that it will inherently replace all instances of a string within another string. With `replace()`, you could do this, but you’d have to use regular expressions.

```javascript
let message = "If you have ***dollars, you can get*** bananas.";
console.log(message.replace("***", 3)); // only replaces first
// If you have 3 dollars, you can get *** bananas.

console.log(message.replace(/\*\*\*/g, 3)); // replaces all, but needs regex
// If you have 3 dollars, you can get 3 bananas.

console.log(message.replaceAll("***", 3)); // more easily replaces all
// If you have 3 dollars, you can get 3 bananas.

```

Promise.any()

With `Promise.any()`, Promise is getting a new static method for resolving a collection of promises in the same vein of `Promise.all()`, `Promise.race()`, and the recently added `Promise.allSettled()`. `Promise.any()` works by resolving as soon as any promise in the collection is resolved. This is much like `Promise.race()` except `Promise.any()` won’t reject unless all of the promises reject. As long as _any_ promise resolves, it will resolve with that value.

```javascript
let runner1 = Promise.reject('Ouch, I fell!');
let runner2 = Promise.reject('Too tired; going home.');
let turtle = new Promise(resolve => {
    setTimeout(resolve, 3000, 'Slow and steady...');
});

Promise.any([
    runner1,
    runner2,
    turtle,
]).then(motto => {
    console.log(motto, 'Wins!');
});
/* logs (after 3 seconds):
Slow and steady... Wins!
*/

```

Logical Assignment Operators

A new set of assignment operators have also been added. These are based on the logical operators OR (`||`), AND (`&&`), and nullish coalescing (`??`). Just like you can have addition assignment with `+=`, you can also have OR assignment with `||=`. These logical assignment operators help reduce repetition of the variable being assigned and prevents the variable from assigning it to itself in cases where it would.

```javascript
let isTruthy = 'truthy';
isTruthy ||= 'not set'; // much like: isTruthy = isTruthy || 'not set'
console.log(isTruthy); // truthy
isTruthy &&= 'set';
console.log(isTruthy); // set

let isFalsy = 0;
isFalsy &&= 'not set'; // much like: isFalsy = isFalsy && 'not set'
console.log(isFalsy); // 0
isFalsy ||= 'set';
console.log(isFalsy); // set

let nonNullish = 'non-nullish';
nonNullish ??= 'not set'; // much like: nonNullish = nonNullish ?? 'not set'
console.log(nonNullish); // non-nullish

let nullish = null;
nullish ??= 'set';
console.log(nullish); // set

```

More info:

- [Numeric Separators proposal](https://github.com/tc39/proposal-numeric-separator)
- [String.prototype.replaceAll proposal](https://github.com/tc39/proposal-string-replaceall)
- [Promise.any proposal](https://github.com/tc39/proposal-promise-any)
- [Logical Assignment Operators proposal](https://github.com/tc39/proposal-logical-assignment)
- [All finished proposals (post ES2015)](https://github.com/tc39/proposals/blob/master/finished-proposals.md)

* * *

More tips: [JavaScript Tips of the Day](http://forum.kirupa.com/t/javascript-tip-of-the-day/641803/1)