New binding in javascript?

Question

In the below binding snippet:

function foo(something) {
    this.a = something;
}

var obj1 = {};

var bar = foo.bind( obj1 );
bar( 2 );
console.log( obj1.a ); // 2

var baz = new bar( 5 );
console.log( obj1.a ); // 2
console.log( baz.a ); // 5

In this step var bar = foo.bind( obj1 ); we are binding obj1 which is empty to the foo function .

After executing bar(2) , obj1 value 2 .

Want to know what bar(2) had triggered?

My Assumption:

Since bar is assigned to foo and binded with obj1 , invoking bar(2) could have assigned the this.a = 2 and kept that value in obj1(i.e.obj1 = { a: 2 }).

Is my assumption right?

Nishant Dixit · Accepted Answer · 2018-08-05 16:20:29Z

2

Here bind(obj1) works like you are overriding default scope of foo function to obj1 ,so this keyword replaced with blank object (obj1) inside foo.

function foo(something) {
    //this = {}  (obj1);
    //this.a == obj.a
    this.a = something;
}

var obj1 = {};

var bar = foo.bind(obj1);

answered Aug 5, 2018 at 16:20

Nishant Dixit

5,5125 gold badges22 silver badges32 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Jonas Wilms · Accepted Answer · 2018-08-05 16:29:01Z

2

Calling bind() on a function returns a new bound function. When you call this bound function, it will execute the original function with the context you passed in as the first argument. Therefore this inside foo points to obj1 when you call it through the bound function.

answered Aug 5, 2018 at 16:29

Jonas Wilms

139k20 gold badges164 silver badges164 bronze badges

Comments

Ashok Mandal · Accepted Answer · 2018-08-05 16:31:30Z

2

To understand this , You need to first take what .bind does?

bind is function which returns another function which is called bound.

function x (){
  console.log(this.item)
}

consider the above code , does not have any idea about what item is.

var obj = { item  : 10};

consider this object , this object does know about its item property.

When you call .bind on x object(the function) , it returns the same copy of function(called bound) , but with the context of obj {item: 10}.

var bound = x.bind(obj);

This particular statement says , give this particular function with the context of obj.

Now if we call bound() it will print 10

answered Aug 5, 2018 at 16:31

Ashok Mandal

2782 silver badges13 bronze badges

Comments

user6749601 · Accepted Answer · 2018-08-05 16:20:25Z

0

Your assumption is right.

 var bar = foo.bind( obj1 );

makes bar a reference to the foo object. Thus, you can now access the function via bar.

 bar( 12 );

prints 12 if you call console.log() and so on.

answered Aug 5, 2018 at 16:20

user6749601

Collectives™ on Stack Overflow

New binding in javascript?

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related