To invoke a JavaScript function immediately difference between Call, Apply

A function in JavaScript is a group of reusable code that can be called anywhere in your program. It eliminates the need of writing the same code again and again. It helps programmers in writing modular codes. Functions allow a programmer to divide a big program into a number of small and manageable functions.

Like any other advanced programming language, JavaScript also supports all the features necessary to angular treeview example write modular code using functions. You must have seen functions like alert() and write() in the earlier chapters. We were using these functions again and again, but they had been written in core JavaScript only once.

You can use call()/apply() to invoke the function immediately. bind() returns a bound function that, when executed later, will have the correct context (“this”) for calling the original function. So bind() can be used when the function needs to be called later in certain events when it’s useful.

Code sample below for call()

var obj = { name: “Biswabhusan” };

var greeting = function(p, q, x) {
return “Hello “+ this.name +” to “+ p +” “+ q +” in “+ x;
};

console.log(greeting.call(obj,”Newtown”,”KOLKATA”,”WB”));

The first parameter in call() method sets the “this” value, which is the object, on which the function is invoked upon. In this case, it’s the “obj” object above.

Code sample for apply()

var obj = { name: “Biswabhusan” };

var greeting = function(p, q, x) {
return “Hello “+ this.name +” to “+ p +” “+ q +” in “+ x;
};

// Array of arguments to the actual Function
var args = [“Newtown”,”KOLKATA”,”WB”];
console.log(greeting.apply(obj,args));

Similarly to call() method the first parameter in apply() method sets the “this” value which is the object upon which the function is invoked. In this case it’s the “obj” object above. The only difference frequently asked css interview questions of apply() with the call() method is that the second parameter of the apply() method accepts the arguments to the actual function as an array.

Code sample for bind()

var obj = { name: “Biswabhusan” };

var greeting = function(p, q, x) {
return “Hello “+ this.name +” to “+ p +” “+ q +” in “+ x;
};

// Creates a bound function that has same body and parameters
var bound = greeting.bind(obj);
console.log(bound(“Newtown”,”KOLKATA”,”WB”));

In the above code sample for bind() we are returning a bound function with the context which will be invoked later.

The first parameter to the bind() method sets the value of “this” in the target function when the bound function is called. Please note that the value for first parameter is ignored if the bound function is constructed using the “new” operator.

The rest of the parameters following the first parameter in bind() method are passed as arguments which are prepended to the arguments provided to the bound function when invoking the target function.