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 functionLocal 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 functionLocal 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 functionLocal 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