JavaScript: The Recent Parts

Named Arguments

Kyle Simpson

Kyle Simpson

You Don't Know JS
JavaScript: The Recent Parts

Check out a free preview of the full JavaScript: The Recent Parts course

The "Named Arguments" Lesson is part of the full, JavaScript: The Recent Parts course featured in this preview video. Here's what you'd learn in this lesson:

Kyle demonstrates a method of improving the readability of code by naming arguments.

Preview
Close

Transcript from the "Named Arguments" Lesson

[00:00:02]
>> Kyle Simpson: Okay. So hopefully you're feeling a lot more confident now about some of the nuances and quirks, but remember with destructuring, watching me do some destructurings and even having typed it out a couple of times, it's not nearly enough. You're gonna have to practice with this. So I wanna show you a couple of examples of using it in a higher level sense that should help you get more familiar with destructuring.

[00:00:27]
There is a pattern called named arguments. It's an idiom essentially and this is a actually a real thing in certain languages. In JavaScript we don't have a thing called named arguments but by using that object destructuring syntax, we accomplish essentially the same thing. So if I had a lookup record function that used positional arguments like store and id, it means that when I call lookupRecord I have to remember what order those arguments are in.

[00:00:55]
And that can be annoying. Having named arguments at a call site means I can tell it this argument goes to this parameter and this argument goes to this parameter. Since we don't support that, like for example, Scala and Objective C, they support named arguments. We don't support that, but we do have the option, like you see here on line five, of declaring a function with an object parameter, of properties.

[00:01:20]
And then the call site, line 12, when we use an object, we are effectively saying down here, the value 42 goes to the parameter ID. So that's an effect and a naming of the argument at the call site. This is becoming extremely common idiom within JavaScript. I strongly recommend you start thinking about this when you design your functions, the new ones that you write.

[00:01:51]
My rule of thumb is any function that I write from here on, if it has three or more inputs, I always use this object destructuring now. Because it's an almost guarantee that I'm going to sometime later forget what order they go in or want to skip one of them or something like that.

[00:02:09]
And it's always gonna be better to have this named argument call site syntax as an option. If it's only one or two parameters it's kind of a judgement call as to whether or not it's worth it to have the overhead of needing to put an object there or not.

[00:02:27]
The good news about named arguments is that you don't have to worry about position and remembering the order. The downside is you have to remember the name. You have to know what the function calls the parameter. Because if they call it CB and you call it FN, it's not gonna match up.

[00:02:46]
So my suggestion to you to deal with that particular downside of not knowing the naming, is if you start using this idiom, come up with a set of conventions for the names of the common kinds of things you pass into functions. For example, if you pass in callbacks, always call it CB.

[00:03:07]
And then in the back of your head, every time you're going to make a call site and pass in a callback, you know it's called CB. And if you're going to pass in an array, always call it ARR. And if you're going to pass in a single primitive value, always call it V and so on.

[00:03:21]
And if you come up with that set of standard conventions for yourself and document it for your team, 99% of the problems that you would have about remembering those things will easily go away. And then you only have a few random corner cases that you have to remember or document.

[00:03:41]
So named arguments is actually one of my favorite usages of object destructuring and has become an extremely common and popular idiom

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now