Next Generation JavaScript — Cool Features

Chanaka Rathnayaka
PulseQue
Published in
2 min readDec 9, 2018
Source: here

JavaScript is an interpreted programming language which plays its role along with the HTML and CSS in the World Wide Web. This article will discuss a set of cool and rich features of next-generation JavaScript.

Let and Const

In modern JavaScript, Let and Const are used as replacements for var. Var is the keyword which is used to declare variables. Const should use to declare variables with constant values (you cannot reassign values to a variable which is declared as const).

ES6 Arrow functions

Arrow function is a way to create functions using shorter syntax and has more advantages when it comes to managing the scope of this keyword.

Exports and Imports

For the ease of maintainability and manageability, people love to write modular codes. Basically split the code into a more focused set of files. In such scenarios, to access some functionalities in one file from another file, you need export (to make it available) and import (to get access) them in required places.

A file can contain one default and an unlimited number of named exports.

Classes

A class is a blueprint for a JS object. Classes can replace the constructor functions and prototypes.

Inheritance

Spread and Rest Operator

The syntax for Spread and Rest operator is the same and it is (three dots). The usage will determine whether you use it as a Spread or Rest.

Spread operator allows you to pull out all the elements from an array or pull out all the properties of an object. Check below examples

The … operator is really helpful for cloning arrays and objects(since both are reference type copying them safely can be tricky). Spread operator helps to create a clone of an object or an array very easily.

Destructuring

Accessing values of arrays (or objects) and assigning them to variables.

Destructuring is a really helpful feature with function arguments. check the example below. In that example, we only use the value of “name” property inside the printName function.

We can use all the above cool features to save our time and code :)

References,

[1] https://www.udemy.com/react-the-complete-guide-incl-redux/

[2] https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions#No_binding_of_this

[3] https://cdn-images-1.medium.com/max/2000/1*OF0xEMkWBv-69zvmNs6RDQ.gif

https://hackernoon.com/12-amazing-javascript-shorthand-techniques-fef16cdbc7fe

--

--