Some “cool” tips of ES6 you may not have known – Part 1

Tram Ho

To talk about ES6 there is a lot to say, one can say from day to day, month after month … probably not over. ES6 was born 5 years ago (because it was released in 2015 so it is also called ES2015), it is really a true revolution of Javascript, a breakthrough that later most JS Frameworks take. ES6 as the foundation, laying the foundation for the next versions of ES7, ES8 …. ES6 is packed with new features, lots of new syntax important for writing complex applications, including classes and modules, etc. and cloud …

In addition to the quite popular features that we have long learned about ES6 such as Arrow functions, Classes, Let & Const, Template strings … Besides, there are quite a few tips or pretty features. cough “other that you may not know, or already know but have not used it yet (truthfully speaking, myself can not fully grasp its features, just to say that it is just like” not “but not” yet “: v).

Stop rambling long, here I would like to share some tips of ES6 based on my own experience in the process of working, learning, as well as references in many different learning sources.

1. Format “currency”

To format the currencies of the countries of the world, ES6 gives us the method Intl.NumberFormat. Check out the example below:

As in the above example, the Intl.NumberFormat method will have the syntax new Intl.NumberFormat([locales[, options]]), including:

  • locales: including language code + country code, These two can be viewed here and here.
  • options: there are a lot of options, but here are just to mention 2 options are in use: styles and currency. Parameters style we have 3 types: decimal, currency, percent, about the parameter currency You can refer here.

2. Remove Duplicates Array

Suppose we have an array containing a list of elements, in which many elements have duplicate values, so how can we keep only 1 element and delete the duplicates with it.

Of course you will have many ways, ES5 can do it too … but it’s quite confusing, confusing. Or, you can use lodash for example (this is the easiest way, don’t worry about bugs). However, there is an extremely simple way with ES6 that you may have missed for a long time, let’s see the example below:

It’s extremely simple, isn’t it!

3. Process the string with the Spread

Operator spread (…) must be quite familiar with all of you have learned about ES6. To split a string into an array is quite simple, see the following example:

So what’s special about it! Let’s look at another example to see the flexibility and efficiency of using the spread operator.

The above function will format the string by converting the first characters to upper case instead of lower case. This seems to be quite useful when dealing with strings containing proper names.

4. Skip value with Destructuring

Usually to avoid useless variable assignments for values you don’t want, there are usually two ways:

  • Use 1 space
  • Add prefix “_”

Let’s look at a specific example to see the “cool” of Destructuring:

5. Declare Object with Dynamic Keys

Easier way to create objects with Dynamic Keys

With Javascript version before ES6, we have to write together key corresponding to object. With ES6, we can finally create Dynamic Keys when declaring an Object!

Above is a short sharing about some interesting knowledge, tips of Javscript / ES6 that I have gathered in the working process as well as refer to many different learning sources.

Hope it will help you more or less for your work. Thank you and see you again!

Cordially greet and to win!

Share the news now