8

Features introduced in ES2021 ✨✨

 3 years ago
source link: https://dev.to/siddharthshyniben/features-introduced-in-es2021-5eal
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
neoserver,ios ssh client

Features introduced in ES2021 ✨✨

Aug 2

・2 min read

ES2021 is slowly coming out in browsers. Here's a
quick roundup of features provided by ES2021.

string.replaceAll (MDN)

Replaces all instances of a string.

'xx'.replace('x', 'y') //=> 'yx'
'xx'.replace(/x/g, 'y') //=> 'yy'
'xx'.replaceAll('x', 'y') //=> 'yy'
Enter fullscreen modeExit fullscreen mode

Numeric separators (MDN)

Let's you seperate your numbers

const number = 1000000000; // Is this a billion? a hundred millions? Ten millions?
const number = 1_000_000_000; // Ah, so a billion

const FEE = 12300; // is this 12,300? Or 123, because it's in cents?
const FEE = 12_300; // $12,300 (woah, that fee!)
Enter fullscreen modeExit fullscreen mode

Logical OR assignment (||=) (MDN)

Logical OR assignment (foo ||= bar) assigns to foo if it is falsy.

let foo;
foo ||= 'bar';
foo; //=> 'bar'

foo ||= 'baz';
foo; //=> 'bar' (no assignment because foo is truthy)
Enter fullscreen modeExit fullscreen mode

Logical AND assignment (&&=) (MDN)

Logical AND assignment (foo &&= bar) assigns to foo if it is truthy.

let foo;
foo &&= 'bar';
foo; //=> undefined (no assignment because foo is falsy)

foo = 10;

foo &&= 'baz';
foo; //=> 'baz'
Enter fullscreen modeExit fullscreen mode

Logical nullish assignment (??=) (MDN)

Logical AND assignment (foo ??= bar) assigns to foo if it is nullish (null or undefined).

let foo;
foo ??= 'bar';
foo; //=> 'bar'

foo = false;

foo ??= 'baz';
foo; //=> 'bar' (No assignment because foo is not nullish)
Enter fullscreen modeExit fullscreen mode

Promise.any (MDN)

Basically Promise.race, but waits for resolvement instead of settlement.

WeakRef (MDN)

A WeakRef object lets you hold a weak reference to another object, without preventing that object from getting garbage-collected.

Support

You can check out details at CanIUse

Support is not too bad.

  • IE doesn't support any of these (but it doesn't matter).
  • Edge supports all of these from v85. Numeric separators are supported from v79, and WeakRef is supported from v84.
  • Firefox supports all of these from v79. Numeric separators are supported from v70, and String.replaceAll is supported from v77.
  • Chrome supports all of these from v85. Numeric separators are supported from v75, and WeakRef is supported from v84.
  • Opera supports Numeric separators from v62, and supports String.replaceAll from v71.
  • Safari on iOS supports all this from v14.7. Numeric separators are supported from v13, String.replaceAll is supported from v13.7, and Logical assignment and Promise.any are supported from v14.4
  • Android browser supports all this from v92
  • Opera Mobile supports String.replaceAll from v64
  • Chrome for Android supports all this from v92
  • Firefox for Android supports all this from v90
  • Samsung internet supports all this from v14.0. Numeric separators are supported from v11.1
  • Support on Opera Mini, QQ Browser, Baidu Browser, and KaiOS browser is unknown

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK