New features in JavaScript

This article is just extend of my previous article #JavaScript 2019#New in ES

In this article we will know more new features which was not mentioned in above article.

If you didn't read my previous article then click on above link to read.

Long Number Format

When we have a very long number

123490567

Then we write this number like

12,34,90,567

Now we can do same thing in JavaScript by " _"

num =12_34_90_567
console.log(num); // 123490567
console.log(Number(12_34_90_567)); //123490567
console.log(parseInt(12_34_90_567));// 123490567
console.log(1_2_3 + 1_0_2); // 225

But we cant use this feature in following :-

console.log(Number("123_490_567")); // NaN
console.log(parseInt("123_490_567")); // 123

Promise.allSettled

We all know Promise.all(), used to execute all async task together and it will return an array which have all resolved result.

function fun1(){
    return new Promise((resolve, reject)=>{
        setTimeout(()=> {
          resolve(1);
        }, 200);
    })
}
function fun2(){
    return new Promise((resolve, reject)=>{
        setTimeout(()=> {
          reject(2);
        }, 300);
    })
}
function fun3(){
    return new Promise((resolve, reject)=>{
        setTimeout(()=> {
          resolve(3);
        }, 500);
    })
}
function fun4(){
    return new Promise((resolve, reject)=>{
        setTimeout(()=> {
          resolve(4);
        }, 600);
    })
}

Promise.all([fun1(),fun2(), fun3(), fun4()]).then(data=> {
    console.log('Result is: ', data);
})
.catch(err=> console.log('Error is: ', err))

Now if we will run the above code, we will get the error because our second promise(fun2) is rejected.

Error is:  2

In Promise.all the major issue is, if any one of the promise is rejected then we will get rejected result, not the resolve results of other promises. But we want results of all promises whether resolve or reject. We can achieve this by Promise.allSettled.

Promise.allSettled([fun1(),fun2(), fun3(), fun4()]).then(data=> {
    console.log('Result is: ', data);
    for(let item of data) console.table(item)
}).catch(err=> console.log('Error is: ', err))

Now if we execute above code, then output is

Screenshot 2019-12-26 at 3.46.45 PM.png

It will also return an array with the results of all promises, then it will enter into .then(success callback) section. And give output of each promises with the status of each one

fulfilled: Promise is resolved

rejected: Promise is not resolved

"Promise.allSettled return an array which will describe each Promise resolved or not" For more about Promise.allSettled

Another proposed function is Promise.any(), it's still in development but you can read from MDN

Local time Format

Suppose we want

If 0: then Today
If -1: then yesterday
If 1: then tomorrow

For that we need to write if-else or switch case, but we can do this without if-else with the help of Intl.RelativeTimeFormat

const rtf_en = new Intl.RelativeTimeFormat('en', {numeric: 'auto'});
const rtf_hi= new Intl.RelativeTimeFormat('hi', {numeric: 'auto'});

Here we create instance of RelativeTimeFormat and en, hi are language code.

en for English and hi for hindi

rtf_en.format(0, 'day'); // "today"
rtf_hi.format(0, 'day'); // "आज"

rtf_hi.format(-1, 'day'); // "कल"
rtf_en.format(-1, 'day'); // "yesterday"

rtf_en.format(10, 'day'); // "in 10 days"
rtf_hi.format(10, 'day'); //"10 दिन में"

We can do the same thing for year, month, week also

rtf_hi.format(-2, 'week'); // "2 सप्ताह पहले"
rtf_en.format(-2, 'week'); // "2 weeks ago"

rtf_en.format(1, 'month'); // "next month"
rtf_hi.format(1, 'month'); //"अगला माह"

rtf_en.format(0, 'year'); // "this year"
rtf_hi.format(0, 'year'); //"इस वर्ष"

For read more about Intl.RelativeTimeFormat

List Format

Suppose we have list of words or name and we want to format. Means we want to join them in a single sentence

We can do this using Intl.ListFormat

en_lst = new Intl.ListFormat('en');
hi_lst = new Intl.ListFormat('hi');

Here also we create instance of Intl.ListFormat and en, hi are language code

en_lst.format(['Joy', 'July']); // "Joy and July"
hi_lst.format(['Joy', 'July']); // "Joy और July"

Suppose we want "or" case or want to make choices

en_lst = new Intl.ListFormat('en', {type: 'disjunction' });
hi_lst = new Intl.ListFormat('hi', {type:  'disjunction'});
en_lst.format(['Veg Food', 'Nonveg Food']); // "Veg Food or Nonveg Food"
hi_lst.format(['Veg Food', 'Nonveg Food']); // "Veg Food या Nonveg Food"

Read more about Intl.ListFormat

Date Format

Using Intl.DateTimeFormat we can format date easily. If we want only year, month and day from Date object

dt = new Intl.DateTimeFormat('en', {year: 'numeric', month: 'long', day:'numeric'});
dt.format(new Date()); // "December 26, 2019"
dt = new Intl.DateTimeFormat('hi', {year: 'numeric', month: 'long', day: 'numeric'});
dt.format(Date.now()); // "26 दिसंबर 2019"

Read more about Intl.DateTimeFormat

If you have any doubt or question feel free to comment!!

No Comments Yet