How to set default values for named function parameters simulated via object literals in JavaScript?

Question

I'd like to use named parameters (simulated via object literals) in my JavaScript functions for ease of readability. The code I've written works fine when I explicitly pass my parameters, but I'm having trouble trying to set a default value, so that my function can be called not only via as myFunction({someBoolean:true}) OR as myFunction() which would imply a default of someBoolean:false.

myFunction: function({myArgs}){
    myArgs.someBoolean = myArgs.someBoolean || false;
    if (myArgs.someBoolean) {
        [do stuff]
    }
    [do other stuff]
},

This works fine when I call myFunction({someBoolean:true}), but when I call myFunction(), I get "Uncaught TypeError: Cannot read property 'someBoolean' of undefined."

Thanks in advance!

Answer 1

Note the previous answer wouldn't work if you wanted multiple default arguments and some were provided:

Doing myFunction({otherArg: 'hello'}) wouldn't necessarily set myArgs.someBoolean to false.

Rather you should change it the below change:

myFunction: function(myArgs){ // Switch to regular argument vs {myArgs}
    myArgs = myArgs || {}; // Make sure it provided

    myArgs.someBoolean = myArgs.someBoolean || false;
    myArgs.otherArg = myArgs.otherArg || 'defaultValue'
    if (myArgs.someBoolean) {
        [do stuff]
    }
    [do other stuff]
},

Then this could be called with: something.myFunction({someBoolean: true, otherArg: '...'})

Answer 2

function x({myArgs}){}

is used for object destructuring, such that you can use myArgs as a variable inside the function when an object with the myArgs property is being passed. For example:

function x({myArgs}){
  console.log(myArgs);
}
x({myArgs: 5}); // logs 5

However, you’re accessing the boolean like an object property of myArgs (myArgs.someBoolean). Then you should use this instead:

function x(myArgs = {someBoolean: false}){
  console.log(myArgs.someBoolean);
}
x({someBoolean: true}); // logs true
x(); // logs false

This now matches your case. If you want to use someBoolean directly, use this:

function x({someBoolean} = {someBoolean: false}){
  console.log(someBoolean);
}
x({someBoolean: true}); // logs true
x(); // logs false

Another option is

function x({someBoolean = false, someOtherBoolean = true} = {}){
  console.log(someBoolean);
}
x({someBoolean: true}); // logs true
x(); // logs false

Reference on MDN.

Answer 3

The proper way would be

function f({someBoolean = false} = {}){
  console.log(someBoolean)
}
f(); // false
f({}); // false
f({someBoolean: true}); // true

That is,

• If no parameter is passed, fallback to {}.

• Destruct the parameter or the fallback, extracting the someBoolean property as a variable. If there is no such property, fallback to false.

Answer 4

myFunction: function({someBoolean = false}){
    if (someBoolean) {
        [do stuff]
    }
    [do other stuff]
},