How chaining of call and bind works internally?

Question

I've a program with functions as Person, greet, specificCall and objects as kumar and chandra.

var fullName=""
function greet() {
    console.log("Welcome "+ this.fullName);
}
var Person=function (name) {
    this.fullName=name
    console.log(this.fullName)
}
var chandra=new Person("chandrakumar")
var kumar=new Person("kumar")
var specificCall=function(){
    console.log("Dude "+ this.fullName);
}
var newGreeting=Person.call.bind(specificCall)// I don't understand the meaning here
newGreeting()// logs Dude 
newGreeting(kumar)//logs Dude kumar How is this happening

I think Person.call is a function as I have checked typeof Person.call and specificCall is a function again. How can I bind a function to a function? Though I wrote this code accidentally I don't understand the logic? Person.call fires the constructor function whereas newGreeting fires the specificCall function. if you look closely newGreeting(kumar) is equivalent to specificCall.apply(kumar). Here the not only context of the scope is changed but the whole function itself. Its like specificCall is bound to Person.call?

Possible duplicate of [Chaining 'bind' and 'call' in JavaScript?](https://stackoverflow.com/questions/31198503/chaining-bind-and-call-in-javascript) — Roy G, Sep 12 '18 at 08:57

Emil S. Jørgensen · Accepted Answer · 2018-09-12T09:39:20.480

1

Call allows you to set the scope for a functions exection, defaulting to window, while activating it.

//Set global variable to fallback to
var fullname = "Window";
//Set local variable
var person = {
    fullname: "Bob"
};
//Definer caller object
function logObject() {
    //"this" references current scope
    console.log(this.fullname);
}
//Call with nothing, defaulting to global
logObject.call();
//Call with specific object as scope
logObject.call(person);

Bind sets the scope for a function, but doesn't activate it.

//Set global variable to fallback to
var fullname = "Window";
//Set local variable
var person = {
  fullname: "Bob"
};
//Definer caller object
function logObject() {
  //"this" references current scope
  console.log(this.fullname);
}
//Bind with nothing, defaulting to global
var logger1 = logObject.bind();
//Execute
logger1();
//bind with specific object as scope
var logger2 = logObject.bind(person);
//Execute
logger2();

As far as i can tell, you bind specificCall to a call on Person, meaning that firing newGreeting is the same as running Person.call but with specificCall as the bound scope.

It's not pretty code and i would personally recommend a more readable structure:

var fullName = "window";
var Person = function (name) {
    this.fullName = name;
};
var chandra = new Person("chandrakumar");
var kumar = new Person("kumar");
function specificCall(scope) {
    if (scope === void 0) { scope = window; }
    console.log("Dude " + scope.fullName);
}
specificCall(); // logs Dude window
specificCall(kumar); //logs Dude kumar

edited Sep 12 '18 at 09:39

answered Sep 12 '18 at 09:21

Emil S. Jørgensen

6,216
1
15
28

void 0 in your code can be simplified to undefined right? Is there any specific reason for using void 0? – ChandraKumar Sep 13 '18 at 08:49
1

In principle you could assign `undefined` as a variable like this: `var undefined = true`. It's highly unlikely, but just to be safe, the `void 0` is foolproof. But yeah, `void 0` is the same as unmodified `undefined`. – Emil S. Jørgensen Sep 13 '18 at 08:53
Thanks but we can't change window.undefined as it is only readable but you can change the value of shadowed undefined. – ChandraKumar Sep 14 '18 at 09:28
@ChandraKumar Correct, `void 0` is to be safe in any scope, but if you know you are in the global scope, `undefined` is safe. – Emil S. Jørgensen Sep 14 '18 at 11:37
But the reason you gave "As far as i can tell, you bind specificCall to a call on Person, meaning that firing newGreeting is the same as running Person.call but with specificCall as the bound scope" seems incorrect because Person.call fires the constructor function whereas newGreeting fires the specificCall function. if you look closely newGreeting(kumar) is equivalent to specificCall.apply(kumar). Here the not only context of the scope is changed but the whole function itself. Its like specificCall is bound to Person.call but your explanation shows Person.call is bound to specificCall – ChandraKumar Sep 15 '18 at 09:23

How chaining of call and bind works internally?

1 Answers1