ES6 Syntax and Feature Overview

Variable declaration

let x = 0 var x = 0

Constant declaration

const CONST_IDENTIFIER = 0 // constants are uppercase by convention

Arrow function syntax

let func = (a) => {} // parentheses optional with one parameter let func = (a, b, c) => {} // parentheses required with multiple parameters

Template literals

let str = Release Date: ${date}

Implicit returns

let func = (a, b, c) => a + b + c // curly brackets must be omitted

Key/property shorthand

let obj = { a, b, }

Method definition shorthand

let obj = { a(c, d) {}, b(e, f) {}, }

Destructuring (object matching)

let {a, b, c} = obj

Array iteration (looping)

for (let i of arr) { console.log(i) }

Default parameters

let func = (a, b = 2) => { return a + b }

Spread syntax

let arr1 = [1, 2, 3] let func = (a, b, c) => a + b + c

console.log(func(...arr1)) // 6

Classes/constructor functions

class Func { constructor(a, b) { this.a = a this.b = b }

getSum() {
    return this.a + this.b
}
}

let x = new Func(3, 4)

Inheritance

class Inheritance extends Func { constructor(a, b, c) { super(a, b)

    this.c = c
}

getProduct() {
    return this.a * this.b * this.c
}
}

let y = new Inheritance(3, 4, 5)

Modules - export/import

<script type="module" src="import.js"></script>  let func = (a) => a + a
let obj = {}
let x = 0

export {func, obj, x}

import {func, obj, x} from ‘./export.js’

console.log(func(3), obj, x)

Promises/callbacks

let doSecond = () => { console.log(‘Do second.’) }

let doFirst = new Promise((resolve, reject) => {
setTimeout(() => {
    console.log('Do first.')

    resolve()
}, 500)
})

doFirst.then(doSecond)