Arrow Functions

Also known as the Fat Arrow.
Array functions are anonymous and change the way 'this' binds in functions.
These can be used to simplify function scoping.
A function can be re-written using the fat arrow.
By using the Fat Arrow we do not have to type the 'function' keyword, type the return keyword
Curly brackets are also not required if the function only contains one expression.



Lambda Functions

Lambda function is a small anonymous function that consist of only one expression and can take one or multiple parameters.
They basically allow functions to be passed as parameter to other functions.
Since in JavaScript, functions are treated as object so they can be passed and returned from other functions to implement lambda functions.



When you use a Regular function (with the function keyword), the value of the 'this' keyword depends on HOW the function was called (the object that made the call)

const myFunc1 = function () { 
};

is equivalent to this

const myFunc2 = () => { 
};

When you use an Arrow function, the value of the 'this' keyword depends on WHERE the function was defined (the scope where the function was defined)
Arrow functions are extremely useful when working with Events and Listeners.
Regular functions provide access to their "calling" environment while arrow functions provide access to their "defining" environment.


A function expression is an anonymous function object that we set equal to a variable
This is defined using a pair of parenthesis that contain the list of parameters followed by a fat arrow and a pair of curly brackets

var checkNum = (num) => { 
   return num % 2 === 0;
}


Functions - No Parameters

const returnfifty_var = function() { 
   return 50;
};

const returnfifty_var = () => { return 50; }
const returnfifty_var = () => 50;


Functions - One Parameter

const addfifty_var = function(x) { 
   return x + 50;
};

const addfifty_var = (x) => { return x + 50; }
const addfifty_var = (x) => x + 50;

For single statement arrow functions there is an implicit return

const myFunction = () => ( { value : 'text' } )  

Not to be used inside classes to declare constructors or methods.
For single statement functions you can condense to one line
Instead of

const myFunction = function (param1) { 
   dosomething()
}

you can have

const myFunction = (param1) => { 
   dosomething()
}

or

const myFunction = param1 => runOneStatement() 

This last notation can only be used when you have one parameter.
This last notation also removes the curly brackets when you only want to run one statement



Functions - Two Parameters

const addtwonumbers_var = function(x, y) { 
   return x + y;
};

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


const myFunction = function (param1, param2) { 
   dosomething()
}

you can have

const myFunction = (param1, param2) => { 
   dosomething()
}




let age = window.prompt("What is your age?", 18); 

let welcome = (age < 18) ?
  () => alert('Hello') :
  () => alert("Greetings!");

welcome(); // ok now


© 2022 Better Solutions Limited. All Rights Reserved. © 2022 Better Solutions Limited TopPrevNext