What is this JavaScript Function.call method doing?

Question

var function1 = function(){};
var function2 = function(){};
function1.call(function2.prototype);

I have spent way too much time trying to understand the above piece of code. Could any one explain how are function1 and function2 changed in the case above ?

functional mixins

I am able to call methods in function1 on an object of function2. So, my conclusion was function must have changed.

• Explosion Pills: What do you mean by changed?
• T.J. Crowder: Re your edit: Don't expect people to follow random links. If there's is something of substance, quote it in the question itself.
• ShaggyInjun: You seem to have better things to do with your time, I suggest you get on with those and let the kinder folks take time and answer my question. Thanks for the suggestion however.
• the system: ShaggyInjun: Instead of taking offense, take the advice of @T.J.Crowder as useful information. The more self-contained your question is, the better for you and everyone else. Links are nice, but should be considered supplemental, with the most relevant information placed directly in the question.

Answer 1

Given your code example, the value of this in that invocation of function1 will be set to the value of the function2.prototype object.

var function1 = function(){
 console.log(this === function2.prototype); // true
};
var function2 = function(){};
function1.call(function2.prototype);

So methods (or other values) on function2.prototype will be accessible from this inside function1.

But if they're simply invoked as like this:

this.someMethod();

then the value of this inside the method will be the actual prototype object. This would be an unusual use.

---

The code example from your link seems to be this:

var asCircle = function() {
 this.area = function() {
 return Math.PI * this.radius * this.radius;
 };
 this.grow = function() {
 this.radius++;
 };
 this.shrink = function() {
 this.radius--;
 };
 return this;
};
var Circle = function(radius) {
 this.radius = radius;
};
asCircle.call(Circle.prototype);
var circle1 = new Circle(5);
circle1.area(); //78.54

---

In this example, the asCircle function adds methods to whatever is provided as its this value. So basically, Circle.prototype is being enhanced with additional methods as a result of this invocation.

As you can see, the .area() method becomes available in the prototype chain of Circle after it was assigned via that invocation.

So it's not that the function being invoked is using the methods, but just the opposite... it's providing new methods.

• ShaggyInjun: Interesting, I am trying to use this with SimpleJSInheritance. For some reason, it doesn't work. It could be because of the reason you mentioned with the this.someMethod(); example. But, that should probably be in a question of its own. Thanks once again.
• the system: @ShaggyInjun: You're welcome. Yes, this approach is a way of extending only. The methods are probably not useful being invoked. Frankly, it seems a little odd to use .call() and this for this purpose. I'd rather they just accept the .prototype as a regular argument. It would seem clearer that way.

Answer 2

they aren't. your code is calling function1 using function2's prototype as the context. So in the call, "this" will map to function2's prototype, instead of the window object (assuming you're calling it from a browser)