Digital Transformation in HealthCare Solution

Tech Talk

ECMAScript 2021 Features

02 APR 2021

See the interesting and powerful features which will be release by ECMAScript 2021. Lets have a look at them.

1. Numeric Separators

Numeric separators is one of the useful features that have been introduced in ES2021. They make it easier to read large numbers in JavaScript by providing separation between digits using underscores _.


let myNumber = 3_000_000;
console.log(myNumber); //output: 3000000
let num = 0.000_0003;
console.log(num); //output: 3e-7

This makes it much easier to read big numbers when editing your code.

2. Replace All

One of the features I really like about ES2021. Now, Easily replace all the characters that you specify in a string without using a regex.

replaceAll('str1', 'str2') It takes two parameters: the character we want to replace and the character we want to replace it by.


const string = "Javascript is the best web scripting language. Javascript can be used for both front end and backend";
console.log(string.replace("Javascript", "Typescript"));
// output: Typescript is the best web scripting language. Typescript can be used for both front end and backend


let myStr = ‘Prograssing’;
console.log(myStr.replaceAll(“s”, “m”)); //output: Programming

3. Weak Reference

Weak Reference hold a weak reference of given object, its doesn't prevent garbage collector from collecting the object, It's useful when we don't want to keep the object in memory forever. We can crete WeakRef by simply passing and object to WeakRef param.


const myObject = new WeakRef({
  name: 'KPITENG',
  age: 1995
  });
  //Read the object.
  console.log(myObject.deref()); //output: {name: KPITENG, age: 1995}
  //Access name.
  console.log(myObject.deref().name); //output: KPITENG

4. Promise Any

Promise.any() takes an array of promises as an argument. If all the promises are resolved, then only it will return a result. It will wait untill all promise complete their tasks, no metter wether it's resolve, reject.


 const promise1 = new Promise((resolve, reject) => {
  resolve(‘promise1 was resolved.’);
 });
 const promise2 = new Promise((resolve, reject) => {
  resolve(‘promise2 was resolved.’);
 });
 const promise3 = new Promise((resolve, reject) => {
  resolve(‘promise3 was resolved.’);
 });
 let result = Promise.any([promise1, promise2, promise3]);
 console.log(result); //output: promise1 was resolved. promise2 was resolved. promise3 was resolved.

5. Logical Assignment Operators

ES2021 come out with three useful logical assignment operators: &&= , ||= , and ??= .

The logical assignment operator &&= is used between two values. If the first value is truthy, the second value will be assigned to it.


let firstNumber = 5;
let secondNumber = 20;
firstNumber &&= secondNumber; //output: 20
console.log(firstNumber); //output: 20
//Here is an equivalent to it:
if(firstNumber){
  firstNumber = secondNumber;
}

The logical assignment operator ||= is also used between two values. If the first value is not truthy(falsy), the second value will be assigned to it.


let firstNumber = null;
let secondNumber = 10;
firstNumber ||= secondNumber; //output: 10
console.log(firstNumber); //output: 10
//Here is an equivalent to it:
if(!firstNumber){
 firstNumber = secondNumber;
}

The logical assignment operator ??= checks if the first value is null or undefined. If it is, the second value is assigned to it.


//when first value is null or undefined
let firstNumber = null;
let secondNumber = 10;
firstNumber ??= secondNumber; //output: 10
console.log(firstNumber); //output: 10
//when first value is truthy
firstNumber = 9;
firstNumber ??= secondNumber; //output: 9
console.log(firstNumber); //output: 9
//Here is an equivalent to it:
if(firstNumber == null || firstNumber == undefined){
 firstNumber = secondNumber;
}