ES6 default values for only some of params object

Question

Given a function like the following, what is the correct syntax to use in order to be able to call showToast({ text: "some text"}) and still get the default values for params.autoHide and params.action ?

function showToast (params = {text: 'Something happened!', autoHide: false, action: 'CLOSE'}) {
    //noinspection JSUnresolvedFunction
    const toast = $mdToast.simple()
        .textContent(params.text)
        .position('top right')
    ;

    if (!params.autoHide) {
        toast.hideDelay(false);
    }
    if (params.action) {
        //noinspection JSValidateTypes
        toast.action(params.action); // label for close btn
    }

    $mdToast.show(toast);
}

Tamas Hegedus · Accepted Answer · 2016-07-18T16:14:50.113

2

You can use object destructuring in the argument list too. The only thing that changes is you must not access the parameters through the params object:

function foo({text = "Hi", autoHide = false, action = "CLOSE"} = {}) {
  console.log(text + " " + autoHide + " " + action)
}

foo({text: "asd"});

See babel/repl.

Notice the = {} default value for the destructuring object. This makes it possible to call the function without a single parameter: foo();.

edited Jul 18 '16 at 16:14

answered Jul 18 '16 at 16:09

Tamas Hegedus

26,761
10
55
91

Upvote for putting me in my place and teaching me a thing. Thanks! – Matt Jul 18 '16 at 17:09

David Sherret · Answer 2 · 2016-07-18T17:23:24.470

You can use parameter object destructuring to achieve this:

function showToast({text = 'Something happened!', autoHide = false, action = 'CLOSE'} = {}) {
    //noinspection JSUnresolvedFunction
    const toast = $mdToast.simple().textContent(text).position('top right');

    if (!autoHide) {
        toast.hideDelay(false);
    }
    if (action) {
        //noinspection JSValidateTypes
        toast.action(action); // label for close btn
    }

    $mdToast.show(toast);
}

showToast({ text: "some text" }) // defaults autoHide to false, action to 'CLOSE'

See "Setting a function parameter's default value".

ES6 default values for only some of params object

2 Answers2