0

Say i have a function like this one in typescript:

openMultipleAddFormModal(commission?: Commission, people?: People): void {
 // some data
}

As of my understanding i added the Optional Chaining operator to make a parameter non necessary.

How do i change my code above to have something like this?

 this.openMultipleAddFormModal(res); // where res here refers to people and NOT to commission

Can i do something like c# does, where you can provide the name of the parameter when calling the function and "binding" that to the property?

Something like this in C#:

// main method
 public void UpdateBase(string machineRef = null, string userRef = null){
 Ref = machineRef ?? Environment.MachineName;
 UserRef = userRef ?? Environment.UserName;
}
// and then i specify the parameter i am passing
 UpdateBase(userRef: userRef); // is there something like this in typescript / javascript?

Thanks for any help!

devludo
  • 93
  • 10
  • Since you are using positional arguments, you will need to provide a blank value so that `res` will be mapped to the `people` argument, e.g. `this.openMultipleAddFormModal(undefined, res);` Alternatively, refactor your function to not accept positional arguments but an object instead. – Terry Sep 30 '22 at 10:16
  • the `?` after the function argument is not an optional chaining operator. For what concerns your question, you can simply leave the first parameter empty (or pass `undefined`): `this.openMultipleAddFormModal(,res);` (notice the `,` before `res`) or `this.openMultipleAddFormModal(undefined, res);` – secan Sep 30 '22 at 10:18
  • 1
    I'm surprised I can't find a good dupetarget for this. I can find [this](https://stackoverflow.com/questions/39672287/any-shorter-way-of-skipping-a-function-argument-than-writing-out-undefined), but it presupposes that you know you can use `undefined`. Help me out here folks, there **has** to be one. :-) – T.J. Crowder Sep 30 '22 at 10:19
  • 1
    @T.J.Crowder, not an exact match but maybe this one: https://stackoverflow.com/questions/57667339/how-to-use-optional-parameter-and-rest-parameter-together-in-typescript? – secan Sep 30 '22 at 10:23
  • @T.J.Crowder, also this one is a pretty comprehensive answer, I think: https://stackoverflow.com/a/57243788/14201528 – secan Sep 30 '22 at 10:33
  • 1
    @secan - https://stackoverflow.com/questions/57667339/how-to-use-optional-parameter-and-rest-parameter-together-in-typescript is a good find, thanks for the ping! I'll add it to my list of targets. – T.J. Crowder Sep 30 '22 at 10:42

2 Answers2

3

To "skip" the argument for an optional positional parameter in JavaScript and TypeScript, you pass undefined as the argument for the parameter:

openMultipleAddFormModal(undefined, peopleObject);

If you're really into brevity, you could use void 0 instead of undefined (the void operator's result is always undefined), but frankly it suffers in terms of readability...

Playground link

There's been discussion of allowing arguments to be simply skipped by writing fn(, second), but it's never reached the point of progressing through the JavaScript proposal process.

T.J. Crowder
  • 1,031,962
  • 187
  • 1,923
  • 1,875
  • I eneded up using your suggestion since it's more clean. Seems undefined is the way to go here. Thanks for the reply i'll mark this answer as correct as soon as stackoverlfow will let me do it! – devludo Sep 30 '22 at 10:26
1

There aren't named parameters in Typescript or Javascript. So the only way you could achieve this is to pass the arguments as an object, so both the parameters can be marked as optional.

But you can pass undefined as the first argument if you want, which behaves like not passing the argument. But I personally like the approach below when I encounter a situation like this because I like the ergonomics.

instead of this,

openMultipleAddFormModal(commission?: Commission, people?: People): void {
 // some data
}

do this,

openMultipleAddFormModal(params: {commission?: Commission, people?: People}): void {
 // access like
console.log(params.commission)
}

You can even destructure right in the function definition if you want like this

openMultipleAddFormModal({commission, people}: {commission?: Commission, people?: People}): void {
 // access like
console.log(commission)
}

and when calling the function, do it like this,

this.openMultipleAddFormModal({people: res})

I'm not an expert on this subject but I don't think there's any downside to this approach other than maybe a few milliseconds of more time execute (Which won't ever be noticeable enough).

Nethrenial.
  • 558
  • 1
  • 5
  • 15