Babel箭头功能编译成ES5

Question

Using Babel I've noticed something a little weird.

Shouldn't const app = () => {} be equal to var app = function() {} ?

Babel returns var app = function app() {} .

Answer 1

No, babel is correct as an arrow function assigned to a var should in theory have a name property equivalent to the name of that var to assist in stack traces and reflection. Check out this link for more info. Quick summary in case it goes stale:

The name property of a function is created at declaration time. The name property of a function expression is inferred from the name binding:

var foo = function() {};
console.log(foo.name); // foo

Arrow functions have the same behavior:

var foo = () => {};
console.log(foo.name); // foo

Since this didn't actually get standardized until ES 2015/ES 6 babel has to actually add the name to create a named function expression :

var foo = function foo() {}; // notice it's function *foo* now

to support legacy environments.