08 - Arrow Function in JS

// Arrow Functions=>
//==================

// Usual way of creating and using functions:
//============================================
// function add(x, y) {
//     return (x + y);
// }

// console.log(add(2, 3));

// const fun = function() {
//     console.log('Inside x');
// }

// fun();


//-----------------------------------------------------------------------------


// Now, by using Arrow function syntax:
//======================================

const fun = ()=> {
    console.log('Inside Fun');
}

fun(); // Output: Inside Fun

const add = (x, y) => {
    return x + y;
}

console.log(add(2,8)); // Output: 10

// Implicit return arrow functions
const squareRoot = num => Math.sqrt(num); // here, no need to write return also.
console.log(squareRoot(9)); // Output: 3


//----------------------------------------------------------------------------------


// Now, When not to use Arrow Function Syntax:
//=============================================
//
// An arrow function doesn't have its own this value and the arguments object. 
// Therefore, you should not use it as an event handler, 
// a method of an object, 
// a method of a class, 
// or a prototype method, 
// or when you have a function that uses the arguments object.
// See below example, 
// startCar function defined inside the car object isn't binded to its own Object(car) 
// but to the Window(global) object.
const car = {
    
    name: "Audi",
    price: 1000000,
    startCar: ()=>{
        console.log(this);
        console.log(this.name);
    }
}

car.startCar(); 
// Output : Window {window: Window, self: Window, document: document, name: "", location: Location, …}