// Non Arrow (standard way)<br /> let add = function(x,y) {<br /> return x + y;<br /> }<br /> console.log(add(10,20)); // 30</p> <p>// Arrow style<br /> let add = (x,y) => x + y;<br /> console.log(add(10,20)); // 30;</p> <p>// You can still encapsulate<br /> let add = (x, y) => { return x + y; };

// Normal Function in JavaScript<br /> function Welcome(){<br /> console.log(“Normal function”);<br /> }</p> <p>// Arrow Function<br /> const Welcome = () => {<br /> console.log(“Normal function”);<br /> }

// JavaScript ES5 function<br /> function getGreeting() {<br /> return ‘Welcome to JavaScript’;<br /> }</p> <p>// JavaScript ES6 arrow function with body<br /> const getGreeting = () => {<br /> return ‘Welcome to JavaScript’;<br /> }</p> <p>// JavaScript ES6 arrow function without body and implicit return<br /> const getGreeting = () =><br /> ‘Welcome to JavaScript’;

<br /> ///////<br /> //JavaScript Function Declarations<br /> ///////</p> <p>//4th (arrow function)<br /> hello4 = (name) => { return (“Hello ” + name); }<br /> //OR<br /> hello5 = (name) => { return (`Hello new ${name}`) }</p> <p>//1st (simple function)<br /> function hello1() {<br /> return “Hello simple function”;<br /> }</p> <p>//2nd (functino expression)<br /> hello2 = function() {<br /> return “Hello functino expression”;<br /> }</p> <p>// 3rd ( IMMEDIATELY INVOKED FUNCTION EXPRESSIONS (llFE))<br /> hello3 = (function() {<br /> return “Hello IMMEDIATELY INVOKED FUNCTION EXPRESSIONS (llFE)”;<br /> }())<br />

// Function in JavaScript<br /> function regular(){<br /> console.log(“regular function”);<br /> }<br /> regular(); //regular function</p> <p>// Arrow Function<br /> const arrow = () => console.log(“Arrow function”);<br /> arrow(); //Arrow function

// arrow function shorten way to write function<br /> //it make easy to write callback function<br /> const arrowFunction = names.map((name)=> {<br /> return name.length <6 ? “long name” :”short name”<br /> })<br /> //if we have one parameter in callback function we don’t need to add parenthesis ()<br /> //if there is only one code logic and return value then we can remove return and {}<br /> const arrowFunction = names.map(name=> name.length<10 ? “long name” :”short name” )

// const add = function(x,y) {<br /> // return x + y;<br /> // }</p> <p>// const add = (x, y) => {<br /> // return x + y;<br /> // }</p> <p>const add = (a, b) => a + b;</p> <p>const square = num => {<br /> return num * num;<br /> }</p> <p>// const rollDie = () => {<br /> // return Math.floor(Math.random() * 6) + 1<br /> // }</p> <p>const rollDie = () => (<br /> Math.floor(Math.random() * 6) + 1<br /> )<br />

hello = () => {<br /> return “Hello World!”;<br /> }

function double(x) { return x * 2; } // Traditional way<br /> console.log(double(2)) // 4</p> <p>const double = x => x * 2; // Same function written as an arrow function with implicit return<br /> console.log(double(2)) // 4

([a, b] = [10, 20]) => a + b; // result is 30<br /> ({ a, b } = { a: 10, b: 20 }) => a + b; // result is 30<br />