1. What is ES
ES or Ecmascript is a general-purpose programming language, standardised by Ecma International according to the document ECMA-262. It is a JavaScript standard meant to ensure the interoperability of web pages across different web browsers.
JavaScript is a subset of ECMAScript. JavaScript is basically ECMAScript at its core but builds upon it.
2. What is Ecmascript6
ES6 refers to version 6 of the ECMA Script programming language. It is a major enhancement to the JavaScript language, and adds many more features intended to make large-scale software development easier.
ES6 was published in June 2015. It was subsequently renamed to ECMAScript 2015.
3. New Features in ES6
Since ES6 is a big update there were a lot of new additions to language. So we try to cover most used ones in today's content.
Here are the things we will take a look at;
3.1. arrow-functions
Different function creation syntax which makes it easier creation process. If we want to define function we define a variable that holds access to that function. After that we simply define parameters inside paranthesis. And we will use arrow (⇒) to refer what is the block of that function.
const getUser = (user) => {
return user
}
const getUser = (user) => user
var odds = evens.map(v => v + 1);
var nums = evens.map((v, i) => v + i);
3.2. template-strings
With template string we can combine strings and write javascript expressions much more easily. We can define a string multiline without need to add + to combine them.
`In JavaScript '\n' is a line-feed.`
`In JavaScript this is
not legal.`
var name = "Bob", time = "today";
`Hello ${name}, how are you ${time}?`
3.3. destructuring
Destructuring is one of the best features of ES6. It allows you to get some information from objects and arrays very easily. Here are the examples.
var [a, , b] = [1, 2, 3];
console.log(a)
console.log(b)
function g({name: x}) {
console.log(x);
}
g({name: 5})
var [a] = [];
typeof a
3.4. default arguments, rest and spread
Default Arguments are something that you can define on function definition. Think about it as optional parameters.
Rest syntax allow you to combine all of the arguments that we passed inside an array. It kind of the same with arguments.
Spread allows to as name tells spreas the variables inside an array. We can use it to combine multiple arrays together (Array.prototype.concat) or passing as a argument to functions.
function f(x, y=12) {
return x + y;
}
f(3) == 15
function f(x, ...y) {
return x * y.length;
}
f(3, "hello", true) == 6
function f(x, y, z) {
return x + y + z;
}
f(...[1,2,3]) == 6
3.5. let and const
Let and const can be useful for block-scoped binding meaning you can use them only inside of defined block. let is the new var you can use.
const on the other hand makes you define a variable which in case of redefinement, it will throw TypeError.
function f() {
{
let x;
{
const x = "sneaky";
x = "foo";
}
let x = "inner";
}
}
3.6. promises
Promises are a library for asynchronous programming. They represents the eventual completion (or failure) of an asynchronous operation and its resulting value.
Promise has three states;
- pending: initial state, neither fulfilled nor rejected.
- fulfilled: meaning that the operation was completed successfully.
- rejected: meaning that the operation failed.
const promise = new Promise((resolve, reject) => {
setTimeout(() => {
console.log("Logging from timeout!!")
resolve("promise resolved")
}, 3000)
})
promise.then(res => console.log(res))
Links
