bind() is referring to the wrong object

Question

var my_object = {
    my_function: function() { return this }.bind( this /* which refers to 'my_object' */ )
}

// i get the 'window object' instead of 'my_object' which does not make sense to me , 
// i know that the my_function is already bound to my_object and i 
// know that i do not need to use bind() , i was only trying to understand
// what's  wrong with binding my_function to the same object again
console.log( my_object.my_function() ); 

/* i remove bind() this time */
my_object.my_function = function() { return this };
console.log( my_object.my_function() ); //i get 'my_object' this time which is expected but i should have got the same results above

I have already explained the problem for you, just look at the comments in my code above, thanks in advance

`this` is not going to refer to your object in the object initalizer since the object doesnt exist yet and you arent in an execution context of the object therefore you are binding the wrong `thisArg` — Patrick Evans, Jun 27 '19 at 21:56
The `this` in `bind` is not inside a method (or function on the object), so its value doesn’t change to `my_object` at this point. Related: [javascript, bind `this` dont work](https://stackoverflow.com/q/36077727/4642212). — Sebastian Simon, Jun 27 '19 at 21:56
Object literals don’t create a `this` that refers to the object they represent. That’s not a thing. `this` means the same inside and outside them. — Ry-, Jun 27 '19 at 21:57
What... are you actually trying to _do_ here? What possible use could this code have that normal code can't already do for you? Make an object class, create a `my_object` instance, and... done? Just by writing normal code, `this` will point to your object inside the function. — Mike 'Pomax' Kamermans, Jun 27 '19 at 22:01
In the example without `bind()`, you get the correct `this` because it's based on how it's called, not how it's set. So, when you do `my_object.my_function()`, you see `my_object` because that's what you are calling the function on. For another example of this, try doing `test_func = my_object.my_function;` and then `console.log(test_func())` and you'll see `Window` instead. — gen_Eric, Jun 27 '19 at 22:03
what about the fact that when i change bind(this) to bind(my_object) , it still outputs the windows object ? — AmirWG, Jun 27 '19 at 22:22

score 0 · Answer 1 · answered Jun 27 '19 at 22:03

Your code makes no sense. Unless you're working on transpilers, or code-generator-generators, don't use black magic spec functions like bind().

Just make use of what JS already lets you do when writing perfectly normal code:

// create a normal modern JS class
class MyClass {
  myFunction() {
    return this; // by *definition* "this" will point to the instance you call it on.
  }
}

// create an instance:
let myObj = new MyClass ();

// and verify calling `.myFunction()` returned the correct thing. Which it *has* to.
console.log(myObj.myFunction() === myObj); // true

bind() is referring to the wrong object

1 Answers1