ES6 Features
The Most recent version of ECMAScript/JavaScript.
-
ECMAScript is a scripting language standard and specification.
-
Transpilers can be used to complie ES6 code to ES5 through Babel, Traceur, Closure.
-
ES6 does not fully supported to all browsers.
Some of the most important features of ES6 are -
Let:
-
The let statement specify a block scope local variable. Block is any section of the code of curly braces.
-
var declaration gives us functional scope and let declaration gives us block scope.
-
Let & Var using for Loop.
In Let: For every loop it will initialize new "i" and pass it to the callback function.
In Var: In this, "i" is initialized only once and it will use the same "i" in the callback function.
Const:
-
It is used to create read only named constants. Const also have block scope. A value must be mandatory set with const declaration.
-
Const value canot be change at the later point in same scope.
-
const variable can be declared only once.
-
similar scoping rule as 'let'.
-
const can not assign a new value.
-
const object properties can be change.
Arrow Function:
-
One of the most popular feature of ES6. It introduced a new way of writing concise functions.
-
An arrow function expression has a shorter syntax compared to function expression.
-
Arrow functions are always anonymous.
-
For one parameter, paranthesis are optional.
const squared = x => x * x; -
More than one parameter, parenthesis are manadatory
const squared = (x, y) => x * x;
Example:
-
Using Arrow function we are solving the problem that is caused by using this keyword inside a function.
Without Arrow Function, It does not have context for outer function.
Class:
-
Class are in fact special functons. There are two ways to use class in javascript using class keyword.
-
Syntax using Class Declaration:
-
Class Expressions can be named or unnamed.
var Mobile = class {
constructor() {
Properties
}
};Unnamed Class Expressionvar Mobile = class Mobile2 {
constructor() {
Properties
}
};named Class Expression
-
Example using `Template Literals` & Class Declaration.
Features of Template Literals:
-
Template Literals are also knowns as Template Strings.
-
Multi line strings.
-
Embed Expression.
-
we need to use Back tics `` to write Template Literals.
-
we can avoid the whole confusion when concatenating strings with values and having to escape single and double quotes.
Default Parameters:
It is pretty straight forward concept. You can basically specify a Default values to parameters when you define a function. When you call that function and don't passing a value the default value will be used.
Object Literals:
-
It is most useful when the Object don't have key/value pairs.
-
Possible to use variables as Object keys.
Destructing Assignment:
-
It is kind of special type of assignment which works with Arrays and Objects.
Spread Operator:
-
It takes an array and splits it into the individual elements.
-
The spread operator is specify during function call.
let colorArray = ['Orange', 'Yellow', 'Indigo'];
displayColors(...colorArray)
-
Copy an array.
-
For Adding two arrays.
-
It can be done by using .push() with the spread operator.
Conclusion:
I hope you will find ES6 to be a useful and many enhancements to make JavaScript programming easier and more fun. since now you are familiar with some of the useful features, you can give it a try in your daily coding practice. If you have any query or suggestions just leave the comments below.
555
Leave a Reply
555
Leave a Reply
555
Leave a Reply
555
Leave a Reply