0

These 2 statements seem to do the same thing.

const handleClick = () => alert('foo');

and

function handleClick() {
    alert('foo');
}

Are they identical and just syntactically different? The first one looks like a variable declaration, whereas the second one is clearly a function definition.

JSNinja
  • 133
  • 1
  • 9
  • Have you read on MDN the differences between Regular functions and Arrow functions? Specially for the ones that use implicit return – Roko C. Buljan Oct 16 '21 at 18:56
  • They do absolutely the same thing, and they are the same. The first one is trivial function, the second one is so called arrow function from ES6 specification. – Gorynych Oct 16 '21 at 18:57
  • @Gorynych, they are not the same. – Andy Oct 16 '21 at 20:09

2 Answers2

0

No, they are not the same thing. The arrow function has some limitations:

  • Does not have its own bindings to this or super, and should not be used as methods.
  • Does not have new.target keyword.
  • Not suitable for call, apply and bind methods, which generally rely on establishing a scope.
  • Can not be used as constructors.
  • Can not use yield, within its body.
srgbnd
  • 5,404
  • 9
  • 44
  • 80
  • This makes it look arrow functions have less functionality, so why were they invented? – JSNinja Oct 17 '21 at 02:40
  • @JSNinja one of the top reasons is to solve a "problem" with `this` property. The arrow function doesn't have its own `this` property. Thus, you directly access the `this` of the outer function scope from the callback function. – srgbnd Oct 17 '21 at 06:30
0

ES6 arrow functions provide you with an alternative way to write a shorter syntax compared to the function expression. There is no performance difference.

Are arrow functions faster (more performant, lighter) than ordinary standalone function declaration in v8?

Niquuu
  • 13
  • 4