1. Syntax

• Regular function

In regular function statements, we need to use the function keyword at the start of a function definition or in the case of function expressions assigning an anonymous function to the variable.

function printName(name) {
    console.log(name);
}
//Or
const printName = function(name) {
    console.log(name);
}

• Arrow function

In the arrow function, we just need to put this => (arrow) symbol between the parameters and body of the function.

const printName = (name) => {
    console.log(name);
}
// Or 
/* 
1. We can skip the ( ) parathesis around parameters but,                                                                              
  if only one parameter is there. 
2. The same applies to these `{ }` will look in next difference
*/
const printName = name => console.log(name);

2. Explicit vs. Implicit return

• Regular Function

In regular function whenever we want to return something from the function we explicitly need to write a return keyword and only then it will return that.

function add(a, b) {
    return a + b;
}

• Arrow function

In the arrow function, we don't need to write a return keyword when there is a single statement in a function body and we are not using { } curly braces to wrap the function body, it just implicitly returns the statement or result of an expression.

const add = (a, b) => a + b;
// To return object implicitly wrap it using `( )`
const add = (a, b) => ({ sum: a + b });

But, If there are multiple statements in the arrow function then we have to use { } curly braces or you just use { } to wrap the function body then you have to explicitly write the return keyword to return the result from the function.

const add = (a, b) => { 
    const sum = a + b;
    return sum;
}

3. The behavior of this keyword

• Regular function as a method

When we are using a regular function as a method in Object, Class or calling it over an Object the this keyword will point to that respective object.

const obj = {
  firstName: "Omkar",
  printName = function() {
    console.log(this.firstName);
};
obj.printName(); //The output will be: Omkar
}

• Arrow functions as a method

When we are using an arrow function as a method in Object, Class or calling it over an Object the this keyword will not point to that respective object, instead it will point to the window or the global object. Because arrow functions don't have their own binding with the this keyword.

const obj = {
    firstName: "Omkar",
    printName: () => console.log(this.firstName)
};
obj.printName(); // The output will be: undefined

Due to this, call, apply, and bind methods are NOT suitable for Arrow functions.

4. Constructor

• Regular function as a constructor

In javascript with ES6 class keyword, we can create classes and constructors out of it, but as we know it's just syntactic sugar, under the hood they are simple javascript functions. So we can use regular functions as constructor functions in javascript, and use them to create objects using the new keyword.

function USER(firstName, lastName, userId) {
  this.firstName = firstName,
  this.lastName = lastName,
  this.userId = userId
}
const user1 = new USER("Omkar", "Kolate", "omkarkolate" );
console.log(user1); 
//{firstName: 'Omkar', lastName: 'Kolate', userId: 'omkarkolate'}

• Arrow functions as a constructor

As we discussed in the previous difference that arrow functions don't have their own binding with the this keyword, due to that they can't be used as a constructor function in javascript, and we are not able to create objects using the new keyword, if we try to do it then javascript will throw an error.

const USER = (firstName, lastName, userId) => {
    this.firstName = firstName,
    this.lastName = lastName,
    this.userId = userId
}
const user1 = new USER("Omkar", "Kolate", "omkarkolate");
// Error: Uncaught TypeError: USER is not a constructor

---

TL;DR

1. Syntax of writing this functions are different
2. In the Regular function we explicitly return the result from the function but in the case of the arrow, the function can implicitly return when there is a single statement or expression.
3. Regular function has its own binding with the this keyword but the arrow function doesn't have that.
4. Regular functions can use for the creating constructor, but the arrow functions are not suitable for creating a constructor.

---