JAVASCRIPT

normal function vs arrow function in javascript

// Normal Function
let add = function (num1, num2) {
return num1 + num2;
}

// Arrow Function
let add = (num1, num2) => num1 + num2;

javascript function declaration vs arrow function

Regular functions created through function declarations / expressions are both constructible and callable. ... Arrow functions (and methods) are only callable i.e arrow functions can never be used as constructor functions. Hence, they can never be invoked with the new keyword.

arrow function vs function in javascript

// Arrow function vs function
// Function in JavaScript
function regular(){
  console.log("regular function");
}
regular(); //regular function

// Arrow Function
const arrow = () => console.log("Arrow function");
arrow(); //Arrow function

js arrow vs normal function

// jsdrops.com/arrow-functions

this.whoIsThis = 'TOP'; // Identify this scope

// 1) Defining
const fancyObj {
  whoIsThis: 'FANCY', // Identify this object
  regularF: function () {
    console.log('regularF', this.whoIsThis);
  },
  arrowF: () => {
    console.log('arrowF', this.whoIsThis);
  },
};

// 2) Calling
console.log('TOP-LEVEL', this.whoIsThis); // It's "TOP" here

fancyObj.regularF(); // Output #1 (Fancy)
fancyObj.arrowF();   // Output #2 (Top)

fancyObj.regularF.call({whoIsThis: 'FAKE'}); // Output #3 (Fake)
fancyObj.arrowF.call({whoIsThis: 'FAKE'});   // Output #4 (Top)

js arrow function vs function

// currently common pattern
var that = this;
getData(function(data) {
  that.data = data;
});

// better alternative with arrow functions
getData(data => {
  this.data = data;
});

arrow function syntax vs function expression syntax

// Using function expression syntax
const addNums = function(numOne, numTwo) {
  return numOne + numTwo;
};

// Using new arrow function syntax
const addNums = (numOne, numTwo) => {
  return numOne + numTwo;
};