[javascript] Are 'Arrow Functions' and 'Functions' equivalent / interchangeable?

Arrow functions in ES2015 provide a more concise syntax.

• Can I replace all my function declarations / expressions with arrow functions now?
• What do I have to look out for?

Examples:

Constructor function

function User(name) {
  this.name = name;
}

// vs

const User = name => {
  this.name = name;
};

Prototype methods

User.prototype.getName = function() {
  return this.name;
};

// vs

User.prototype.getName = () => this.name;

Object (literal) methods

const obj = {
  getName: function() {
    // ...
  }
};

// vs

const obj = {
  getName: () => {
    // ...
  }
};

Callbacks

setTimeout(function() {
  // ...
}, 500);

// vs

setTimeout(() => {
  // ...
}, 500);

Variadic functions

function sum() {
  let args = [].slice.call(arguments);
  // ...
}

// vs
const sum = (...args) => {
  // ...
};

To use arrow functions with function.prototype.call, I made a helper function on the object prototype:

  // Using
  // @func = function() {use this here} or This => {use This here}
  using(func) {
    return func.call(this, this);
  }

usage

  var obj = {f:3, a:2}
  .using(This => This.f + This.a) // 5

Edit

You don't NEED a helper. You could do:

var obj = {f:3, a:2}
(This => This.f + This.a).call(undefined, obj); // 5

Arrow functions => best ES6 feature so far. They are a tremendously powerful addition to ES6, that I use constantly.

Wait, you can't use arrow function everywhere in your code, its not going to work in all cases like this where arrow functions are not usable. Without a doubt, the arrow function is a great addition it brings code simplicity.

But you can’t use an arrow function when a dynamic context is required: defining methods, create objects with constructors, get the target from this when handling events.

Arrow functions should NOT be used because:

1. They do not have this

   It uses “lexical scoping” to figure out what the value of “this” should be. In simple word lexical scoping it uses “this” from the inside the function’s body.

2. They do not have arguments

   Arrow functions don’t have an arguments object. But the same functionality can be achieved using rest parameters.

   let sum = (...args) => args.reduce((x, y) => x + y, 0) sum(3, 3, 1) // output - 7 `

3. They cannot be used with new

   Arrow functions can't be construtors because they do not have a prototype property.

When to use arrow function and when not:

1. Don't use to add function as a property in object literal because we can not access this.
2. Function expressions are best for object methods. Arrow functions are best for callbacks or methods like map, reduce, or forEach.
3. Use function declarations for functions you’d call by name (because they’re hoisted).
4. Use arrow functions for callbacks (because they tend to be terser).