Things You Must Know About the Modern JavaScript

Hasini Sandunika Silva
Nerd For Tech
Published in
3 min readMay 31, 2021
Things You Must Know About the Modern JavaScript

Overview

JavaScript or JS is a multi-paradigm language and this supports both object-oriented and functional programming. This was improved and released several editions after the first release. JavaScript holds different data types such as;

  • Number
  • BigInt
  • String
  • Boolean
  • Symbol
  • Object (Function, Array, Date, RegExp)
  • null
  • undefined

Modern JavaScript

Here define some of the key improvements involved in modern JavaScript.

Let

Usually, the let keyword is only visible inside the block. Refer to the following code.

Index is: 0
Index is: 1
Index is: 2
Index is: 3
Index is: 4
console.log("'Length: "+temp);
^
ReferenceError: temp is not defined

But, can avoid this by using the let keyword outside the block. Refer to the following code.

Index is: 0
Index is: 1
Index is: 2
Index is: 3
Index is: 4
Length: 4

Const

This keyword is used to define constants. Usually, constant values cannot be changed further but this is not valid for objects and arrays. This implies, const only protects variables that are not objects or arrays. Refer to the following codes.

temp=index;
^
TypeError: Assignment to constant variable.
{ indices: 0 }
{ indices: 1 }
{ indices: 2 }
{ indices: 3 }
{ indices: 4 }

Freeze

This is used to avoid changes in a particular variable. But, this only freezes first-level objects. This implies freeze keyword cannot be used to protect second-level or inner objects from being changed. Refer to the following code.

{ name: 'Hasini', indices: { index: 0 } }
{ name: 'Hasini', indices: { index: 1 } }
{ name: 'Hasini', indices: { index: 2 } }
{ name: 'Hasini', indices: { index: 3 } }
{ name: 'Hasini', indices: { index: 4 } }

DE structuring

In modern JavaScript, DE structuring can be performed in many ways. Below defines some of them.

When the constants are obtained from the same module, we can use a single line to define them. Refer to the following codes.

Another implementation of DE structuring is;

We can pass an object to the function but the function only obtains the required parameters from the object to perform the particular task defined on it. Refer to the following code.

Name: Hasini
Position: ASE

Here in DE structuring, … can be used to declare separate arrays using a single line (this is possible with objects). Refer to the following code.

1
[ 2, 3, 4 ]
[ 1, 2, 3, 4 ]

Dynamic property

In modern JavaScript, we can set the values for unknown keys inside objects or else. Refer to the following code.

{ name: 'Hasini', tier: 'level-3' }
{ name: 'Hasini', stage: 'level-3' }
{ name: 'Hasini', type: 'level-3' }

Promises

Here, when we call a function, if it has some results, then it promises to pass the results to another function (callback function). This implies, if the results have come then it automatically calls for the callback function and handovers to do the rest to it. Refer to the following sample code.

Usually, we use promises to wrap the content because the content inside the promise takes some time to complete the execution. When the response is ready, it calls for the callback function. After that, only if it is completed, calls for another function called print(value). Based on the situation you can use finally and catch statements.

Instead of using then(), we can implement this with another function involving async and await keywords. Here await is only valid inside the async functions.

References

--

--