Published on

A Review of ES6 - Extended Parameter Handling, Template Literals

Extended Parameter Handling

Default Parameter Values

Simple and intuitive default values for function parameters.

function f (x, y = 7, z = 42) {
    return x + y + z
}
f(1) === 50

Rest Parameter

Aggregation of remaining arguments into single parameter of variadic functions.

function f (x, y, ...a) {
    return (x + y) * a.length
}
f(1, 2, "hello", true, 7) === 9

Spread Operator

Spreading of elements of an iterable collection (like and array or even a string) into both literal elements and individual function parameters.

var params = [ "hello", true, 7 ]
var other = [ 1, 2, ...params ] // [ 1, 2, "hello", true, 7 ]

function f (x, y, ...a) {
    return (x + y) * a.length
}
f(1, 2, ...params) === 9

var str = "foo"
var chars = [ ...str ] // [ "f", "o", "o" ]

Template Literals

String Interpolation

Intuitive expression interpolation for single-line and multi-line strings.

var customer = { name: "Foo" }
var card = { amount: 7, product: "Bar", unitprice: 42 }
var message = `Hello ${customer.name},
want to buy ${card.amount} ${card.product} for
a total of ${card.amount * card.unitprice} bucks?`

Custom Interpolation

Flexible expression interpolation for arbitrary methods.

get`https://example.com/foo?bar=${bar + baz}&quux=${quux}`

Raw String Access

Access the raw template string content (backslashes are not interpreted)

function quux (strings, ...values) {
    strings[0] === "foo\n"
    strings[1] === "bar"
    strings.raw[0] === "foo\\n"
    strings.raw[1] === "bar"
    values[0] === 42
}
quux`foo\n${ 42 }bar`

String.raw`foo\n${ 42 }bar` === "foo\\n42bar"

References: