JavaScript is one of the most popular scripting or programming languages which includes numerous features when it comes to the development of professional web pages. JavaScript is the top programming language according to the Stack Overview’s developer survey for almost six years in a row. It’s also the most popular language on GitHub, beating Java and Python with large numbers.

It is the third most important layer of web technologies, after HTML and CSS. JavaScript is known for its wide range of use like interactive maps on the website, animated graphics, complex data management, etc. Every time a website does more than a static presentation you can be assured that JavaScript is probably behind it. It allows you to create complex web applications and mobile applications.

Moreover, JavaScript is also growing in other development areas, such as games and mobile development. But at the start, JavaScript was not made for all these functions. Over time JavaScript’s popularity increased rapidly and many improvements have been implemented to make JavaScript more robust and versatile for any type of web development.

ECMAScript 2021 12th edition is now available, adding new useful methods and operators to make the code shorter. JavaScript is improving with the release of every new ECMAScript. These releases make JavaScript a more robust, secure and powerful programming language. Here are modern JavaScript features that will help developers accomplish their tasks easily.

• Numeric Separators

Working with large numbers can be hectic because it can be hard to read. The numeric separators allow you to add underscores between the digits. Which makes large digits more readable. These underscores roll out automatically when the file gets parsed.

For example, you can write 10000 as 10_000. Numeric separators work in all latest versions of browsers as well as Node.js. The numeric separator also works on binary, octal, and hexa numbers.

• Let and Const Keywords

Earlier, JavaScript only provided the var keyword for declaring variables. But Variables declared using the var keyword create some new challenges. The first one is if they are declared inside a function you can only access them inside the function. And if you declare them global you can access them anywhere. Second, variables declared with var can be re-declared.

To overcome these problems JavaScript introduced two new declaration keywords let and const. Variables declared with let cannot be re-declared whereas variables declared with const can neither be re-declared nor be updated. Moreover, let and const have block scopes.

• Private Class Methods and Accessors

The class methods and properties are public by default. This means members of the class are available to everyone that can access the (owner) class instance. But the private methods and properties can only be accessed from inside the class. The private methods can be created by using a hash # prefix.

There are two types of private accessors. The first one is Getter; A Getter helps you to fetch the value of a class property and You can define a private getter by using a hash # prefix. The second one is setter; a Setter allows you to assign a value to a class property.

• Logical Assignment Operators

There are three logical assignment operators available in JavaScript. These provide a combination of logical operators and assignment expressions.

Logical OR assignment operator 

Symbols ||=

The logical OR assignment operator accepts two operands and assigns the right operand to the left operand if the left operand is false.

Logical AND assignment operator 

Symbols &&=

The logical AND assignment operator assigns the right operand to the left operand if the left operand is true.

Nullish coalescing assignment operator 

Symbols ??=

The nullish coalescing assignment operator assigns the right operand to the left operand if the left operand is null or undefined.

• Destructuring

Array and object destructuring is another powerful feature of modern JavaScript. It is used to extract the properties of an object or items from an array.  See an example below

const obj = {name: “Dav”, age:27, city:”CHD”}

const { name, age, city} = obj;

In the above example, the properties of “obj” are extracted using object destructuring. So, you can see object destructuring is done using curly brackets. Array destructuring is done using square brackets.

Conclusion

There are many great features of JavaScript and new ones are being added regularly. The above JavaScript features will surely help you for your next project. The nice thing is you can learn them as you need them. You can start off writing plain JavaScript in .js files, and just improve it by adding new features and concepts.