CODEWITHSUNDEEP
javascript
Exitos
Exitos

Reputation: 29720

How does .call in javascript work?

I have seen this code on the MDN site:

01  function Product(name, value){
02     this.name = name;
03     if(value >= 1000)
04        this.value = 999;
05     else
06        this.value = value;
07  }
08   
09  function Prod_dept(name, value, dept){
10     this.dept = dept;
11     Product.call(this, name, value);
12  }
13   
14  Prod_dept.prototype = new Product();
15   
16  // since 5 is less than 1000, value is set
17  cheese = new Prod_dept("feta", 5, "food");
18   
19  // since 5000 is above 1000, value will be 999
20  car = new Prod_dept("honda", 5000, "auto");

It says you can use call to chain constructors. I have some questions:

1) Why is line 14 called why would we add it to the prototype and why would that mean that Product is called when we create Prod_dept?

2) What does line 11 mean? How is this related to the prototype?

3) What is line 20 meant to show us?

Upvotes: 6

Views: 3432

Answers (4)

James South
James South

Reputation: 10635

The code is simply demonstrating prototypal inheritance in JavaScript.

1) What the code is saying on line 14 is that you want your Prod_dept Function to inherit the properties and characteristics of the base Product Function.

Every function in JavaScript has a prototype property and it contains an object that you can add methods and properties to.

Prototype is a special property that gets created as soon as you define the function. Its initial value is an empty object {} but can be overwritten to allow you to define your own methods or inherit those from another Function.

2) Line 10 is simply assigning a property to your Prod_dept Function the value being provided by the dept argument being passed through the constructor.

3) Line 14 is allowing you to apply the other two arguments "name, value" to your base Product function but in the context of your Prod_dept Function. Further information on that method can be found here.

Upvotes: 2

Steffen
Steffen

Reputation: 2237

1) Uses prototypical inheritance - prod_dept inherits from Product. More info if you google "prototypical inheritance".

2) It is what the constructor does - initialising the "dept" member.

3) Together with the comment above it, it just shows that all constructors will be called, so they are really chained.

I think your questions miss the point a little. The magic about call is that the first parameter will be "this" in the called function - if you use it on a constructor, the contructor will act on whatever you passed in as the first parameter to call - this way you can use a constructor on whatever you want because you "fake it" to work on an arbitrary object.

Upvotes: 0

user113716
user113716

Reputation: 322492

1) Setting an instance of Product as the prototype object for Prod_dept adds the values and methods of that Product instance (and its prototype) to the prototype chain of all your Prod_dept instances.

It also allows instanceof to show that an object created from Product_dept is an instance of both constructors

var a = new Product();
var b = new Product_dept();

a instanceof Product       // true
a instanceof Product_dept  // false

b instanceof Product       // true
b instanceof Product_dept  // true

2) Because this is the new object being constructed by Prod_dept, the .call lets you set that object as the this value of the Product method, so that whatever the Product method does with this will be done on that new Prod_dept instance (in this case, running the code for adding values to name and value properties).

3) It just creates a new instance from the Prod_dept constructor.

Overall, this is one pattern for using JavaScript's prototypal inheritance mechanism.

Upvotes: 5

Marc B
Marc B

Reputation: 360632

1) Line 14 makes Prod_dept inherit the Dept object - anytime you instantiate a Prod_dept, it uses Dept as the base object.

2) Line 10 simply stores the words "auto" and "food" in the .dept attribute of the object.

3) Line 20: When Prod_dept is instantiated, JS will instantiate a Dept object as well, and that constructor (Line 1) restricts the value parameter to be 999 at most (lines 3-6)

Upvotes: 0

Related Questions