ES 2015

Also known as ECMAScript 2015 or ES6


let and const
default parameters


import *

Instead of

var React = require('react')  

you can have

import * as React from 'react'  

var, let and const

var declaration are function scoped when declared inside a function and globally scoped when declared outside
var variables are initialized with a value of undefined.
var variables are hoisted to the top of its scope
var variables can be re-declared within the scope


let declarations are block scoped
let variables are not initialised
let variables are hoisted to the top of its scope
let variables cannot be re-declared within its scope


const declarations are block scoped
const variables have the same value throughout the scope
const variables are hoisted to the top of its scope
const variables cannot be re-declared or updated within its scope



Classes

inheritance
static methods
private methods
get and set



Collections






Arrow Functions

Instead of:

const myFunction = function() { 
}

you can have

const myFunction = () => { 
}

For single statement arrow functions there is an implicit return

const myFunction = () => ( { value : 'text' } )  

Not to be used inside classes to declare constructors or methods.
For single statement functions you can condense to one line
Instead of

const myFunction = function (param1) { 
   dosomething()
}

you can have

const myFunction = (param1) => dosomething() 

or

const myFunction = param1 => dosomething() 

This last notation can only be used when you have one parameter.


implicit return



this keyword

when used inside an object method
(declared using without arrow functions)
this refers to the object


When used in combination with arrow functions 'this' will be undefined
For this reason do not use arrow functions inside objects



Promises

They provide one way to deal with asynchronous code



Object Destructuring



Array Destructuring




Array Spread Operator

This operator is three dots.

const a = [1,2,3] 
const b = [...a, 4,5,6]

Array Rest Elements

This is an improved way to handle function parameters.
The rest parameter represents an indefinite number of arguments as an array.


Template Literals

The syntax uses backticks instead of single or double quotes.

const mystring = `text` 

Template Tags

In styled components, template tags are used to define CSS strings

const Button = styled.button 
   font-size : 1.5em
   color : white

Multi-Line Strings

Instead of having to use the '\' character at the end

const string = `first part\ 
              second part`

you can now use a back tick character

const string = `first part 
                  second part`


Interpolation



Arrays

Array.find -
Array.findIndex -


Function Parameter Default Values


Numbers

Number.MIN_SAFE_INTEGER
Number.MAX_SAFE_INTEGER
Number.EPSILON
Number.IsInteger -
Number.IsSafeInteger -


New Global Methods

isFinite()
isNaN()




© 2019 Better Solutions Limited. All Rights Reserved. © 2019 Better Solutions Limited TopPrevNext