A Review of ES6 - Enhanced Object Properties, Destructuring Assignment

Enhanced Object Properties

Property Shorthand

Shorter syntax for common object property definition idiom.

var x = 0, y = 0
obj = { x, y }

Computed Property Names

Support for computed names in object property definitions.

let obj = {
    foo: "bar",
    [ "baz" + quux() ]: 42
}

Method Properties

Support for method notation in object property definitions, for both regular functions and generator functions.

obj = {
    foo (a, b) {
        …
    },
    bar (x, y) {
        …
    },
    *quux (x, y) {
        …
    }
}

Destructuring Assignment

Array Matching

Intuitive and flexible destructuring of Arrays into individual variables during assignment.

var list = [ 1, 2, 3 ]
var [ a, , b ] = list
[ b, a ] = [ a, b ]

Object Matching, Shorthand Notation

Intuitive and flexible destructuring of Objects into individual variables during assignment.

var { op, lhs, rhs } = getASTNode()

Object Matching, Deep Matching

Intuitive and flexible destructuring of Objects into individual variables during assignment.

var { op: a, lhs: { op: b }, rhs: c } = getASTNode()

Object And Array Matching, Default Values

Simple and intuitive default values for destructuring of Objects and Arrays.

var obj = { a: 1 }
var list = [ 1 ]
var { a, b = 2 } = obj
var [ x, y = 2 ] = list

Parameter Context Matching

Intuitive and flexible destructuring of Arrays and Objects into individual parameters during function calls.

function f ([ name, val ]) {
    console.log(name, val)
}
function g ({ name: n, val: v }) {
    console.log(n, v)
}
function h ({ name, val }) {
    console.log(name, val)
}
f([ "bar", 42 ])
g({ name: "foo", val:  7 })
h({ name: "bar", val: 42 })

Fail-Soft Destructuring

Fail-soft destructuring, optionally with defaults.

var list = [ 7, 42 ]
var [ a = 1, b = 2, c = 3, d ] = list
a === 7
b === 42
c === 3
d === undefined

References:

• https://es6-features.org