Discussion on: Arrow functions: a walkthrough and gotchas

[Reed Jones]

const helloWorld = _ => console.log("Hi") doesn't really mean 'there will be for sure no defaults', in fact it can be used as a regular variable!

const double = _ => _ * 2
double(5) // 10

its really no different than

const double = number => number * 2

[Sylwia Vargas]

Yeah, it can be used as a variable but customarily, it seems to mean that there wouldn't be any default arguments. Codewise, it is not different - you are right in that.

[Kyle Roach]

Customarily? Actually, if you use any linters like eslint or typescript, using _ will tell the developers that it does have an argument, while () shows as void and passing any argument will throw a warning.

See typescriptlang.org/play/index.html...

[Sylwia Vargas]

I wouldn't say TypeScript is a linter — did you mean TSLint?
I appreciate you bringing TS perspective but the blog post is entirely about just JS.

Historically, as linters are considered, the underscore parameters would trigger is declared but never used error, which was fixed in TypeScript 2.0. However, it does still trigger unused variable/parameter warning from a linter. As we all know, linters are not always correct or up to date.

As I said, it is a niche thing and I trust my colleagues who expressed such an opinion. Perhaps it is also a team-depending styling choice.

I heard that the difference is that if e.g. you run in the browser console now and paste

document.body.addEventListener("click", () => console.log(event))

this will still have an access to the default argument that's event, which would not be the case with _. However, trying this out with _ that works as well so maybe that's browser-dependent? In all honesty, I don't have the time now to track this down but will put it in the "parking lot" for the times when I can research it.

Also, it's fascinating that you've been on Dev for over two years and this is your first post or comment ever. I'm quite happy that my post evoked such strong feelings that you decided to respond!

[Kyle Roach]

Sure, TypeScript isn't exactly a linter and this post isn't about TypeScript, but I would say that today a lot of js tooling is powered by typescript so it's not a far stretch.

But okay let's use JSDoc, which isn't typescript related. You can see it still generates _ to be expecting a variable.

[Sylwia Vargas]

I'm happy you feel passionate about this subject and I appreciate the time you put into this (making the screen recording, converting it into a gif, uploading it). For now, I'll just repeat: "As we all know, linters are not always correct or up to date." I'd be curious what docs say about it if you wanted to actually check what the motivation/history is behind introducing the _ as a variable.

[Kyle Roach]

_ as a variable is used when you want to ignore the first parameter when using a function, we sometimes call it a throwaway variable.

A great example in the Array.forEach method. Say we wanted to loop through items in an array and console out the index.

The first argument in the forEach callback is the item, and the second is the index. Because parameters are ordered in js, if we want to use the 2nd one, we have to provide a variable for the 1st one.

const names = ['Sylwia', 'Kyle'];

names.forEach((name, index) => console.log(index))

Since what we really need is the second variable, we can omit the first one with _.

names.forEach((_, index) => console.log(index))

So _ acknowledges there is a parameter there, but we're not using it in our implementation.

Here are two posts I found you can use for reading:

• stackoverflow.com/questions/276370...
• The section on "No Arguments with Arrow Functions" wesbos.com/arrow-functions

[Sylwia Vargas]

Awesome! Thanks. This is what I meant by

there will for sure be no defaults you care about

I was aware of the Wes Bos' post, which is where I encountered the _ back in the day. Since this is niche, produces warnings and seems to be treated differently by dev teams, I am quite curious about how the argument came to be and what the intention was behind it — perhaps the ES6 standards or discussion thread will shed some more answer.

Thanks for the research — I've included a mention of your comment in the blog :)