Javascript ES 6 functions ES 6 functions Work














![Arrow syntax example const names = ['Tutorials. Point', 'Mohtashim', 'Bhargavi', 'Raja'] names. map((element, index)=> Arrow syntax example const names = ['Tutorials. Point', 'Mohtashim', 'Bhargavi', 'Raja'] names. map((element, index)=>](https://slidetodoc.com/presentation_image/2cf4850c7c00ae471c42405cedfe9777/image-15.jpg)



- Slides: 18
Javascript ES 6 functions
ES 6 functions • Work the same way as any language • Can have parameters or not • Can return a value or not
Default parameters function add(a, b = 1) { return a+b; } console. log(add(4)) What does this return?
Default parameters function add(a, b = 1) { return a + b; } console. log(add(4, 2)) What does this return?
Default parameters function add. Two. Numbers(first, second = 10){ console. log('first parameter is : ', first) console. log('second parameter is : ', second) return first+second; } console. log("case 1 2 3 4 5 sum: ", add. Two. Numbers(20)) sum: ", add. Two. Numbers(2, 3)) sum: ", add. Two. Numbers()) sum", add. Two. Numbers(1, null)) sum", add. Two. Numbers(3, undefined)) What do these return?
Rest parameters • Rest parameters are similar to variable arguments in Java. • Rest parameters doesn’t restrict the number of values that you can pass to a function. • However, the values passed must all be of the same type. Rest parameters should be the last in a function’s parameter list. • To declare a rest parameter, the parameter name is prefixed with three periods, known as the spread operator. function fun 1(. . . params) { console. log(params. length); } fun 1(); fun 1(5, 6, 7);
Anonymous Functions • Functions that are not bound to an identifier (function name) are called as anonymous functions. • These functions are dynamically declared at runtime. • Anonymous functions can accept inputs and return outputs, just as standard functions do. • An anonymous function is usually not accessible after its initial creation.
Anonymous Functions var func = function(x, y){ return x*y }; function product() { var result; result = func(10, 20); console. log("The product : "+result) } product()
Recursive Anonymous Functions (function() { var msg = "Hello World" console. log(msg) })() Result: Hello World Create an anonymous function that adds three numbers. Test your function with various numbers
Lambda functions • Lambda refers to anonymous functions in programming. • Lambda functions are a concise mechanism to represent anonymous functions. • These functions are also called Arrow functions.
Lambda functions There are 3 parts to a Lambda function − • Parameters − A function may optionally have parameters. • The fat arrow notation/lambda notation (=>): It is also called the go to operator. • Statements − Represents the function’s instruction set. Function name Parameters Function body var foo = (x) => 10+x; console. log(foo(10))
Lambda functions • Can leave out the parenthesis if there is one parameter: var msg = x => { console. log(x); } msg(10) • Can leave out the curly brackets if there is one statement: var disp = ()=>console. log("Hello World"); disp();
Lambda functions • Lambda functions vs regular functions • Similar to pointer variables vs regular variables • Example: int x = 10; int* y = malloc(sizeof(int)); *y = 10; • Example: function x () { return 10}; x(); y = () => return 10; y(); • Can pass function y as an argument but not x
Arrow syntax example const add = (n 1, n 2) => n 1+n 2 console. log(add(10, 20)) const is. Even = (n 1) => { if(n 1%2 == 0) return true; else return false; } console. log(is. Even(10)) What is the result?
Arrow syntax example const names = ['Tutorials. Point', 'Mohtashim', 'Bhargavi', 'Raja'] names. map((element, index)=> { console. log('inside arrow function') console. log('index is '+index+' element value is : '+element) }); What is the result? What does this do? Why do you get the last line of output?
this • Inside an arrow function if we use this pointer, it will point to the enclosing lexical scope. • This means arrow functions do not create a new this pointer instance whenever it is invoked. • Other types of functions do create a new this pointer when invoked • Arrow functions makes use of its enclosing scope.
Example //constructor function Student 2(rollno, first. Name, last. Name) { this. rollno = rollno; this. first. Name = first. Name; this. last. Name = last. Name; this. full. Name = function(){ //uses this instance of outer scope (()=>{ console. log(this. first. Name+ " "+this. last. Name) })(); // creates a new instance of this , hides outer scope of this (function (){ console. log(this. first. Name+ " "+this. last. Name) })(); } } const s 2 = new Student 2(101, 'Mohammad', 'Mohtashim') s 2. full. Name();
Example 2 //constructor function Student(rollno, first. Name, last. Name) { this. rollno = rollno; this. first. Name = first. Name; this. last. Name = last. Name; this. full. Name. Using. Anonymous = function(){ set. Timeout(function(){ //creates a new instance of this , hides outer scope of this console. log(this. first. Name+ " "+this. last. Name) }, 2000) } this. full. Name. Using. Arrow = function(){ set. Timeout(()=>{ //uses this instance of outer scope console. log(this. first. Name+ " "+this. last. Name) }, 3000) } } const s 1 = new Student(101, 'Mohammad', 'Mohtashim') s 1. full. Name. Using. Anonymous(); s 1. full. Name. Using. Arrow(); The function set. Timeout takes 2 arguments, a function and a time in ms. When the time is finished, the function is called.