Functions in JavaScript Dhananjay Kumar [@debug_mode] Delhi Chapter Lead Microsoft MVP Mindcracker MVP Telerik Evangelist http://debugmode.net FB: Dhananjay.25july@gmail.com
Type of function JavaScript Functions Named Function Anonymous Function Anonymous functions should be assigned to a variable
Nested functions mainfunction(7, 6); function mainfunction(a, b) { alert(a); nestedfunction(88); function nestedfunction(c) { alert(b); }; }; Nested function can access variable of parent function Parent function cannot access variable of nested function You cannot call nestedfunction from anywhere but the function it is nested within.
functions in JavaScript  You can store it in a variable You can pass it as parameter of other function You can use it in an expression
functions in JavaScript Pass by Value var greetingmessage = "Hey DJ"; function showmessage(greetingmessage) { greetingmessage = "I am changing value"; } showmessage(greetingmessage); alert(greetingmessage); Pass By Reference var arrayofname = ["dj"]; function showmessage(arrayofname) { arrayofname[0] = "dhananjay"; } showmessage(arrayofname); alert(arrayofname[0]);
Invocation patterns in JavaScript Invoking functions As functions As methods As constructors Indirectly through call() and apply()
Method invocation pattern
Functions constructor in JavaScript • Parameters are passed as string in Function constructor • Last parameter is always body of the function • Body of the function is also in string • Statements in body are separated with semicolon • If there is no input parameter then body of function would be first and only parameter in constructor • Any number of arguments can be passed in Function constructor var add = new Function ( "a", "b", "return a+ b; " ); var abc = add(7, 9); console.log(abc);
Functions constructor in JavaScript • It always complies as top level function • It creates and complies a JavaScript function dynamically at run time • Each time it creates a new object. So creating function using constructor in a loop is not recommended and it is inefficient var message = "Hello All"; function Data() { var message = "Hello Data"; return new Function("return message") ; } var result = Data()(); alert(result);
functions as value • JavaScript function can be assigned to a variable • JavaScript function can set as property of an Object • JavaScript function can be passed as argument to other function • JavaScript function can be returned from function etc… function FindGrade(e) { if (e > 60) return "Grade A" else return "Grade B" } var abc = FindGrade; var result1 = FindGrade(20); console.log(result1); var result2 = abc(70); console.log(result2);
Optional parameter in functions Does not do any type checking on argument values Does not do any checking on number of arguments passed JavaScript function can be called 1. With exact number of arguments 2. With more number of arguments than specified 3. With less number of arguments than specified
Optional parameter in functions Less Number of Arguments PrintValues(20, 30); function PrintValues(a, b,c) { console.log(a + b); console.log(c); }
Optional parameter in functions • While passing less number of arguments, you handle undefined either using if or || operator. • Always pass optional parameter as last argument.
Optional parameter in functions More numbers of Arguments PrintValues(20, 30,40,50,60); function PrintValues(a, b,c) { if (arguments.length > 3) { throw Error("invalid arguments"); } console.log(a); console.log(c); var abc = arguments[4]; console.log(abc); }
Functions in JavaScript Namespace in JavaScript Global if defined outside any function Local to function and all nested function , if defined in function var MyModule = { //code for module here GetData: function () { var student = { name: "dj", grade: 10 }; var nameisobjectofstudent = "toString" in student; alert(nameisobjectofstudent); } };
Functions in JavaScript Namespace in JavaScript Global if defined outside any function Local to function and all nested function , if defined in function var MyModule = { //code for module here GetData: function () { var student = { name: "dj", grade: 10 }; var nameisobjectofstudent = "toString" in student; alert(nameisobjectofstudent); } };
Functions in JavaScript Namespace in JavaScript Global if defined outside any function Local to function and all nested function , if defined in function var studentObject = { name: "dj", marks: 89, findgrade: function (marks) { if (marks > 75) { return "Grade A "; } else { return "Grade B "; } } } var grade = studentObject.findgrade(99); alert(grade);
Functions in JavaScript  It takes a function as argument  It returns a function as output.
Functions in JavaScript Less Number of Arguments

Java script

  • 1.
    Functions in JavaScript DhananjayKumar [@debug_mode] Delhi Chapter Lead Microsoft MVP Mindcracker MVP Telerik Evangelist http://debugmode.net FB: Dhananjay.25july@gmail.com
  • 2.
  • 3.
    Nested functions mainfunction(7, 6); functionmainfunction(a, b) { alert(a); nestedfunction(88); function nestedfunction(c) { alert(b); }; }; Nested function can access variable of parent function Parent function cannot access variable of nested function You cannot call nestedfunction from anywhere but the function it is nested within.
  • 4.
    functions in JavaScript You can store it in a variable You can pass it as parameter of other function You can use it in an expression
  • 5.
    functions in JavaScript Passby Value var greetingmessage = "Hey DJ"; function showmessage(greetingmessage) { greetingmessage = "I am changing value"; } showmessage(greetingmessage); alert(greetingmessage); Pass By Reference var arrayofname = ["dj"]; function showmessage(arrayofname) { arrayofname[0] = "dhananjay"; } showmessage(arrayofname); alert(arrayofname[0]);
  • 6.
    Invocation patterns inJavaScript Invoking functions As functions As methods As constructors Indirectly through call() and apply()
  • 7.
  • 8.
    Functions constructor inJavaScript • Parameters are passed as string in Function constructor • Last parameter is always body of the function • Body of the function is also in string • Statements in body are separated with semicolon • If there is no input parameter then body of function would be first and only parameter in constructor • Any number of arguments can be passed in Function constructor var add = new Function ( "a", "b", "return a+ b; " ); var abc = add(7, 9); console.log(abc);
  • 9.
    Functions constructor inJavaScript • It always complies as top level function • It creates and complies a JavaScript function dynamically at run time • Each time it creates a new object. So creating function using constructor in a loop is not recommended and it is inefficient var message = "Hello All"; function Data() { var message = "Hello Data"; return new Function("return message") ; } var result = Data()(); alert(result);
  • 10.
    functions as value •JavaScript function can be assigned to a variable • JavaScript function can set as property of an Object • JavaScript function can be passed as argument to other function • JavaScript function can be returned from function etc… function FindGrade(e) { if (e > 60) return "Grade A" else return "Grade B" } var abc = FindGrade; var result1 = FindGrade(20); console.log(result1); var result2 = abc(70); console.log(result2);
  • 11.
    Optional parameter infunctions Does not do any type checking on argument values Does not do any checking on number of arguments passed JavaScript function can be called 1. With exact number of arguments 2. With more number of arguments than specified 3. With less number of arguments than specified
  • 12.
    Optional parameter infunctions Less Number of Arguments PrintValues(20, 30); function PrintValues(a, b,c) { console.log(a + b); console.log(c); }
  • 13.
    Optional parameter infunctions • While passing less number of arguments, you handle undefined either using if or || operator. • Always pass optional parameter as last argument.
  • 14.
    Optional parameter infunctions More numbers of Arguments PrintValues(20, 30,40,50,60); function PrintValues(a, b,c) { if (arguments.length > 3) { throw Error("invalid arguments"); } console.log(a); console.log(c); var abc = arguments[4]; console.log(abc); }
  • 15.
    Functions in JavaScript Namespacein JavaScript Global if defined outside any function Local to function and all nested function , if defined in function var MyModule = { //code for module here GetData: function () { var student = { name: "dj", grade: 10 }; var nameisobjectofstudent = "toString" in student; alert(nameisobjectofstudent); } };
  • 16.
    Functions in JavaScript Namespacein JavaScript Global if defined outside any function Local to function and all nested function , if defined in function var MyModule = { //code for module here GetData: function () { var student = { name: "dj", grade: 10 }; var nameisobjectofstudent = "toString" in student; alert(nameisobjectofstudent); } };
  • 17.
    Functions in JavaScript Namespacein JavaScript Global if defined outside any function Local to function and all nested function , if defined in function var studentObject = { name: "dj", marks: 89, findgrade: function (marks) { if (marks > 75) { return "Grade A "; } else { return "Grade B "; } } } var grade = studentObject.findgrade(99); alert(grade);
  • 18.
    Functions in JavaScript It takes a function as argument  It returns a function as output.
  • 19.
    Functions in JavaScript LessNumber of Arguments