Hacker News Reader

Comment by jtmarmon | Hacker News Reader

even more abused now w/ es6 arrow shorthand

I wish named arrow functions made it into the spec.

A workaround for this to get the best of the two worlds:

    let func = () => {};

That seems to do it.

  let func = () => {};
  console.log(func.name); // func

and in stack traces:

  let func = () => foo();
  func()

results in:

  Uncaught ReferenceError: foo is not defined
  func @ test.js:1

Wow. I had no idea that would work.

All this time I've been using the full named function expressions over arrow functions just for the stack traces.

Still though, in situations where I care about the stack trace, I don't see myself writing:

  let doStuffCallback = () => {};
  doStuff(doStuffCallback);

over:

  doStuff(function doStuffCallback() {
  });

Does that only work with something like babel? Because using the node 5.1 repl (and chrome console) you get:

    > let func = () => {}
    undefined
    > func.name
    ''
    > function longfunc() {}
    undefined
    > longfunc.name
    'longfunc'

sadly, babel is taken for granted these days.

The .name property doesn't seem to get set in Firefox either, but error stack traces do show the variable name as the function name. That's the important part IMO.

Have you tried it with a « var » instead as Chrome imposes certain restrictions on the new ES6 keywords?

I also checked the online Babel REPL and verified that it works fine.

var results in the same behavior in chrome (empty string for a function name)

It looks like babel does this little nicety for stack-trace readability.

I think Babel converts the code to ES5 and then execute the statements and therefore the function's name is printed to the console just like what you expect from good old ES5 code.

The most direct ES5 translation of

    let func = () => {}

would be

  var func = function() {}

But even in that case, func.name is going to be "".

    var func = function func() {};

That's what the Babel REPL spits when you input the « let » statement.

Which is the same as var func = function(){...}.bind(this); no es6 required.

OP is saying that `let func = () => {};` creates a named function where func.name equals "func" and "func" appears as part of the stack trace.

Your example is still an anonymous function just bound to a different context.

and more verbose as well which was the concern of person to whom I replied.

on the other hand, es6 classes encourage named methods ...

Reply on news.ycombinator.com