JavaScript Function call()

JAVASCRIPT BASICS

Java script Function Call ()

(00:00)

Hello guys welcome to our series Java script. In our last segment we saw how to create functions and along with that we also saw function with parameters, function without parameters and function with return value, we will move in our today’s segment with same concept. We are going to see objects available in Java script, means through function whatever object related operations we perform and through functions whatever objects we get.

Like we know Java script is object related scripting language, in Java script class is not generated, in our introductory segment, we took car named class as example and we generated different objects of the car named class like Ertiga XUV and Swift, they are objects of car named class. So when we talk about Java and C++ which are object oriented programming language, that time we have permission to create class as well as we can create objects of that class, but in Java script this is not the case, objects are already created and we have to work through those objects.

Means we do not create object of class, we directly create an object, so in Java script the objects which are already available we can move further in our programming. So guys when we are working in Java script remember we do not generate class and we can’t even create but we can perform all the object related operations because Java script gives us object.

We will move further with same concept like what is function object in Java script, as it is written here, the purpose of Function constructor is to create a new Function object, now the question may arise, what is constructor? As we have already seen in our introductory lecture as well as when we saw new keyword, whenever we create object of class we have to call its constructor.

I will explain this through sublime text, this is our sublime text in this html, whenever we generate a class we have to write it like this, class then after class name of class let’s say abc then open parenthesis and close it, so this is the method to generate class, whenever we generate a class we have to write its name and then add class keyword before it.

So when we are creating class we will also create that class’s object, through that object we can access our class, we will see our car example here lightly not in depth because we have to consider our function object, but in order to understand constructor we will take this example. So whenever we create class, class has a default constructor, like whatever our class’s name is will be our constructor’s name also, in this case abc, which is written in this way, so name of constructor is name as name of our class always and this constructor method has to be called whenever we create object.

So let’s say I have to create object of class abc, so how can we create that? So it should be like var, you can give any name as per your choice, so var a =new and then name of our class abc and this constructor. Now what happens because of this? Our variable is created our object is created of class. When is this object created? When we call its constructor, so in order to create object we need to call constructor.

So here I am creating an object of name A of which class? Class abc, so if compare this with our car example, it will look like this car named class and car named constructor, let’s say we want some properties in constructor, like model then color, let’s say these are our two things or properties which we are considering. Let’s say model and color are two properties of our class car and whenever we call constructor, I will introduce two parameter, this.model equal to model, this.color equal to color.

(05:32)

So here what can we see? Here it is abc so let’s say my object was XUV, so XUV equal to new and this is our constructor and name of model is XUV and color is red, here what have we done? We have car named class and we created its constructor and in this constructor we have two properties of car i.e. model and color, whenever we create a new object we will assign that object new properties, model and color.

So here we have called its constructor while creating the object and in that we have passed name and color, so here we have already given parameters, here will this value name will come under model and red will come under color, so this.model means our class’ s property, this.model will indicate this model and this model we got from parameter, similarly this.color indicates this color which is property of car and color indicates our color which we got from parameter. So we have created object by calling constructor through two parameters, so we can create as many objects we want by this method.

Next is (12 seconds gap) so let’s say I create second object with name swift, so what will be the property of that object? Model will be swift and its color will be white, so we can create as many object we want. So we saw how we can create object? We have taken car’s example so that we can understand it properly, of class car we have created two object through constructor.

Now we will move back to slide, the purpose of function constructor is to create a new function object. So you can see here we have taken car named class and we have created its object using the constructor.

Now we are working in Java script, so in Java script we do not have class we have functions instead, so what will be the use of functions? The function which will be created, through its constructor I can create function’s object and I can execute it throughout my script whenever required. If we call the constructor directly, a function is created dynamically but in an unsecured way, means if I call a constructor of any function then that function’s object will get created and along with that my function will also get called dynamically, dynamically means whenever we want we can call it with whatever value we want to pass.

So dynamically my function will be called but way will not be secured because through this way we do not work in that. In java script we work in this way, common similarity is that our syntax is new and then function and our parameters which we have to pass. So whatever we have used like creating class and defining the property, defining constructor, and then defining object, this all gets removed in Java script. Here the example we will give in this way and the syntax which is given in that way we will define.

So what is the syntax of defining function object? First we will use new keyword and after that whatever our function is, so you can see when we created a function in last segment in that we used small f now we are creating constructor that’s why we here we are using capital F. here you can see the name car which we have used we have taken same car here, usually in Java and C++ whenever we create class the first letter is always capital and whatever our class’s name is same is the name for our constructor.

 So here if I have written cars in capital then here also I have to write cars in capital, similarly in java script how we have to do? New then using capital f for function and as many parameters as you want to give and this function body is added directly by comma. For this we will take an example, so let’s say I create and function’s object in the script, I am not creating function I am directly creating a function’s object, of which function? That even I don’t know but the default function object which is available we will create its object.

(10:25)

It will be like new function, now let’s say I have to create such a function through which I can return two number’s summation, so here I will create a add named function object in that what will I write? First will be number 1 and second parameter will be number 2 and third parameter will be return, means what am I returning? So that will be my return and number 1 plus number 2, that’s it semicolon. Now here what am I doing? I have taken two numbers here, number 1 and number2, which we are passing through parameters and in function body I have written, return the number 1 plus number 2, means their summation.

So here what will I write, document.write, whatever my function’s name is , you can see I have created function’s object but I have given it name add, so here I will call that add and 2, let’s ay 2 comma 8 I want to perform, means summation of two numbers, 2 plus 8 will be 10 so our output should be 10. So let’s name this program as example function object 1 and will save it as (16 seconds gap) so here as I run this program you can see my output is 10, because we have created function’s object by number 1 and number 2 and through that I have returned the summation.

So now whenever I will write add and pass two numbers through that I will always get their summation as my output. Let’s say I pass, here I am getting 20(4 seconds gap)okay, we are getting 10 and 20, which means we have created a function’s object and through that we have performed this summation. Same thing can be done through function also but line of code gets extended we require more line of code, function object is a functionality which Java script provides us, so through that we can work.

Now the example which we took in function object is basic, there are some function objects available in Java script which Java script provides us as a facility with help of which large tasks can be done in very few line of code. So first the function object which we are receiving and how does it work and what exactly is function object, we need to understand all these.

So let’s say I generate another example this of function object, let’s say I create function object 2, now I want to return the power of number which I am passing , means the two numbers which I will give, power operation should perform between those two, means first number will be my number and second number will be power of first number.

So in that case what will I do? What we have to do? Let’s say in that program we wrote var add, so similarly here we will write var power equal to new function, in that we have to pass two numbers so same, number 1 comma number 2, writing return is necessary, return, now her we have to perform power operation, power operation comes under math, so we will write math, power class is pow so math.pow comma in parenthesis we have passed two numbers, we will add that here (number one comma number 2), what will happen because of this?

Our number 2 will become power of number 1 and answer will be returned to us. Let’s say I write document.writeln and we have to pass our variable so it will be like power 2, 3 save and reload so in output we are getting 8 so if here I pass 5 comma 2 so square of 5, so here I will get 25, so this is my output. So whatever function’s object we have created, the name which we have given to object we have to access through it, so we have written power so we will write power, earlier we wrote add so we will write add. In this way we can create function object and move further.

(15:40)

Now very important topic which is advanced level topic of Java script, we have function methods here, there are 4 methods available to us in Java script, even if you are experienced candidate this questions may be asked in interview if you are fresher then chances are less because this is advanced level topic. It is not necessary that they will not ask you at all if you are fresher, in case of both experience and fresher these question may come. So I request you to pay attention as this and advanced level function in Java script, here we have 4 methods call, apply, bind and tostring, we will see all these methods one by one.

First is call, you can see here the function which we created we have passed many arguments and we have also passed function body. So this call method is used between two function and we will make these two function interact with each other by using call, apply and bind. With help of these three we will make these functions interact . But how? In call when we will pass parameter that time we will pass comma separated parameter.

In apply we will pass it in form of array and in bind we will create a new function, in tostring we will convert our function in string, tostring is comparatively easy. We will start understanding these three one by one. First is call, what is in call? The Java script function call method is used to call a function contains this value and an argument provided individually.

Means we have two things in call, when we write function.call and we will pass arguments as it is written here, means in case of call we will pass parameters without array, we van pass as may parameters as we want but in that we will not pass array we will pass parameters. This.arg, when we studied class we saw about this, here it is not necessary to use this keyword but remember we have to pass parameters in case of call, here we can see function.call is written means in our today’s example you saw we created two examples, add and power, if power and add are my function then power dot call, add dot call, I have to write it in this way only, so here function.call is written and these are our parameters, we will see an example to get better understanding, here you can see an example, a function is created name of function is Emp and then again we have created one more function with name PermanentEmp, we have function named employee and function named permanent employee.

So now I will create an object of permanent employee and I will call it through this, so here you can see document.writeln new permanentEmp, means whose object are we creating? We are creating permanent employee’s object, and what have we written in its body? Emp.call means some other function which is here we are calling that means with help of permanent employee we are calling another function and whatever properties of that function are like id and name, we are assigning values to them.

So here what are we doing? We are calling one with help of another function, through which parameter? We are receiving two parameters in function, here you can function Permanent Employee in that we have received id and name, so same id and name I am passing here, if I don’t write this then also it will work, so this id name and if you don’t write id name then also it’s okay, so same id name, we have passed id name but to whom? We passed it through Emp.call means to employee, in order set id and name of this function I have used permanent employee function.

So whose object am I creating? Permanent employee’s but I am calling it through function employee, so this thing can be done directly also, we can also write document.writeln new permanent emp, but in that case it will become employee, it will not become permanent employee, if we have to make it permanent employee then we have to call class employee through permanent employee.

Let’s try to understand its logic, every employee is on either contract basis or permanent basis , but both are still employee, so data for employee and permanent employee will be same, so for common things between those two we will not call different functions . In case of permanent employee also we have assigned properties of employee only but because the employee is permanent so we are going through class permanent employee.

(20:58)

That’s why here Emp.call is written, so if we perform this practically, so this our call example that’s why,(18 seconds gap) so this is our program, so here you can see what we have done? First we have created the function named employee in that we are taking id and name by parameters, okay so here id and name is given, you can see what we have returned? Whatever id is given we have made it this function’s id and the name which is given, we have made it this function’s name, meaning of this is that we are creating that function’s name and id so this will be this.id equal to id and this.name equal to name, so this is our function.

Now another function is of permanent employee so function permanent employee, in that also we have passed id and name. So through this function we are calling whom? We are calling employee function, so it will go here, here will come capital E, capital E or small e won’t make much difference because we are working with object, as we know first letter is capital in class so we have taken here also capital letter. So object will be like emp.dot call, in that call we will write this.id comma and this.name, sorry id comma name, okay so the id and name which we got from parameters, same id and name we will pass here.

Now we will write document.writeln, we have to create object so new Permanent employee, in bracket I am passing id 1 comma we can pass any name let’s say in string I will pass Pratik Patel, that’s it. so from here till here this portion is our object creation portion, so here our object will be created, whatever our data is like 1 that will come here, id will set here, partik patel name will come here so it will be set here.

But document.writeln is for printing something, so what do we have to print? The object which we created here, let’s say I have to create its id, o I will write here dot id and save, if I add this here then my program gets reference, it gets a context that we have to assign id and name to this. So you can see here the name Pratik Patel is getting printed here. Similarly, if here I write id then here I will get 1 and after that Pratik Patel, but here I have used new keyword twice which means the object is created twice, means same object is getting created twice which is not a proper way, either create id or create name, create one object and bring data from that object only. 

(24:54)

So here you can see this becomes important when, this Pratik Patel and 1 means the id and name the parameters, the properties which we have passed, to properly assign this to our function which we have to call, using this becomes important. So let’s see step by step, first we have created an object by document.write after that we have to make Pratik Patel permanent employee, that’s why we have created object for permanent employee, we got id and name, this id and name has been bound or joined with Emp by call method. So the permanent employee’s data and employee’s data is same.

Here we have access properties of one function through another function with help of call. If we move further in same thing then we have another example of call where we performed same thing, one is permanent employee and one is temporary employee so we have created object for each and we have printed them both. How have we printed it?

So let’s say we have function same (3 seconds gap) this is same temporary employee,(5 seconds gap) we are passing same thing , id and name , you can see this id and name, same things are passed, we have called the same function, permanent employee is also calling employee and temporary employee is also calling employee. When we are creating object we creating one for permanent employee, so let’s say from here we are using through object so var, we will create object to which we will name var pEmp, means permanent employee equals to new, so permanent employee, in which we will pass id ie.e 1 and name i.e. Pratik Patel, okay.

 So we will create another variable, temporary, so it’s like temp equl to new temporary employee, to which we will give new id i.e. 2 comma new name Prashanth Patel, so in our case Pratik is permanent employee whereas Prashant is temporary employee, so now we have to print data of both, so we will write document.writeln first is data of permanent employee that will go in pEmp.id then here plus little bit space and then dot pEmp.name, that’s it we have both the things. Next is document.writeln br and now we have to printtemporary employee’s data also so document.writelntEmp.id space (5 seconds gap), okay so save and reload, so here there is some error in console, document.writln is not a function means here I will add e so okay and this our data, 1 Pratik Patel and 2 Prashant Patel.

So here we created two objects of two function, one for permanent employee and one for temporary employee, we have called both the objects by same thing by employee only, you can see object has been created of employee. We have called employee through two different function, by creating object for both we have also retrieved the data from their object, for pEmp and from tEmp.

So here we have learned that we can create as many objects by call method and we can assign it with whichever function we want and we can create its object also. So we are creating permanent employee’s object through employee by call method and then we are creating object or temporary employee through Emp by call method.

So this was our call method, so in today’s segment we cleared the concept of function object and we have cleared call method. So we still have three methods pending apply, bind and tostring, which we will see in our next segment.

Thank you.

(video duration 30 minutes 8 seconds)