Parameter names with ES6?

10,901

Solution 1

I recommend that you work around this with passing an object and using destructuring for objects:

function callApi({url, callback, query = {}, body = {}})

And then call it as:

callAPI({url: "/api/..", callback: (x => console.log(x)), body: {a:2}})

Which would give you syntax similar to the one you want.

Named arguments have been considered and rejected for JavaScript, unlike other languages like C# and Python which sport them. Here is a recent discussion about it from the language mailing list.

Solution 2

As shown on this site, the defaults are just for parameters that need a default value (like an options parameter), but not for 'skipping' parameters.

What you're trying to do is

// function definition
function hi(a,b,c,d)

// function call
hi(a,b,d)

ES6 is still going to think that your 'd', is the defined c, regardless of your default value.
So no, ES6 does not have such syntax.

Solution 3

You can't specify which parameter you assign to in your call.

call_api('/api/clients/new', function(x){console.log(x)}, body={1:2})

Is equivalent to setting a variable named body outside of the function and then passing its value in the query parameter's spot.

You could use destructuring to achieve what you want though.

function call_api(url, callback, {query = {}, body = {}} = {})

Then in your call you would do this

call_api('/api/clients/new', function(x){console.log(x)}, {body:{1:2}})

Solution 4

Seeing that the default parameter value is only used when the parameter is undefined, the only way to "skip" a parameter and fall back to the default would be to send undefined in it's place:

call_api('/api/clients/new', function(x){console.log(x)}, undefined, {1:2})

Example: Babel REPL

The value of query within the function will be {} (or whatever you set default to) in this case.

This would be somewhat similar to what Visual Basic does when you want to use the default parameter value by passing an empty value. (e.g. sub name(argument 1, , , argument 4))

Otherwise, if you wanted support for named parameters, the best compromise would be the answer supplied by @Benjamin Gruenbaum.


Update: You might find this article provides an option using the arguments keyword, or better yet, you could iterate over the ES6 ...rest parameters collection to simulate an overloaded function in Javascript.

Share:
10,901
Jesvin Jose
Author by

Jesvin Jose

Tech lead at Marlabs, Kochi. Loves Sqlalchemy, Django, Vue. Admin of many Telegram coding groups. Memorised several passages by Marcus Aurelius.

Updated on June 18, 2022

Comments

  • Jesvin Jose
    Jesvin Jose about 2 years

    I have defined a function like:

    function call_api(url, callback, query = {}, body = {})
    

    I expected a syntax where I can provide body and skip query:

    call_api('/api/clients/new', function(x){console.log(x)}, body={1:2})
    

    But I have to use this workaround:

    call_api('/api/clients/new', function(x){console.log(x)}, {}, {1:2})
    

    Even if I provide body=, it appears its appearing as the query parameter. I use Babel with Webpack. I tried the syntax in Chrome console and in Webpack source.

    Is such a syntax supported by ES6? How does it work?