javascript - Difference between bind and var self=this? - Stack Overflow

admin管理员组

文章数量:1332389

In my react native code, I am using both the bind(this) and var self = this; at multiple places across modules.

Both are solving the problem of resolving this keyword at the right places.

Here are my codes(2 code to perform the same functionality)-

1. Using bind(this)

   retval.then(function (argument) {
       console.log("argument"+JSON.stringify(argument));
       this.stateSetting(argument);
   }.bind(this));
   

2. Using var self = this

   var self = this;
   retval.then(function (argument) {
      console.log("argument"+JSON.stringify(argument));
      self.stateSetting(argument);
   });
   

Considering they both do the same job, I am curious to know what is the right way to do it? Is there an issue in using one or the other? Or is there a better way to do it?

In my react native code, I am using both the bind(this) and var self = this; at multiple places across modules.

Both are solving the problem of resolving this keyword at the right places.

Here are my codes(2 code to perform the same functionality)-

1. Using bind(this)

   retval.then(function (argument) {
       console.log("argument"+JSON.stringify(argument));
       this.stateSetting(argument);
   }.bind(this));
   

2. Using var self = this

   var self = this;
   retval.then(function (argument) {
      console.log("argument"+JSON.stringify(argument));
      self.stateSetting(argument);
   });
   

Considering they both do the same job, I am curious to know what is the right way to do it? Is there an issue in using one or the other? Or is there a better way to do it?

• javascript
• reactjs
• this
• bind
• react-native

Share Follow asked Dec 27, 2015 at 19:13 bozzmobbozzmob 12.6k1717 gold badges5151 silver badges7373 bronze badges 6

• 1 Both work fine. I'd try to be somewhat consistent within a an app or at least a module. – Robert Moskal Commented Dec 27, 2015 at 19:16
• 4 ES6 arrow functions are a better way to do this. – Oriol Commented Dec 27, 2015 at 19:19
• Thanks Robert :) Just wanted to know, if I do something like if(self === this) returns true. So, is there a way to destroy self? If it was an object I could have done - self = {}. Should I point self to null in this case? – bozzmob Commented Dec 27, 2015 at 19:22
• @Oriol Yes indeed, I would surely go with ES6 arrow function. Can you please share a pesudo code for the same? I am using arrow functions in lot of other places. – bozzmob Commented Dec 27, 2015 at 19:23
• 1 Simply: retval.then((argument) => { console.log("argument"+JSON.stringify(argument)); this.stateSetting(argument); }); developer.mozilla/en-US/docs/Web/JavaScript/Reference/… – lleaff Commented Dec 27, 2015 at 19:27

 |  Show 1 more ment

1 Answer 1

Sorted by: Reset to default 8

Given that you're targeting Node.js which implements ES2015 you are better off using arrow functions. Arrow functions have what is called a lexical this, which means that the variable this in an arrow function is treated like a normal variable and will be closed over when you create the function.

So your code bees:

retval.then((argument) => {
    console.log("argument"+JSON.stringify(argument));
    // "this" will inherit the value of the outside scope
    this.stateSetting(argument); 
});

If targeting ES5 (older browsers), then I'd favor the .bind style rather than var self = this. It's more structured and closer to a functional approach, which makes the code easier to reason about like you must have discovered by using promises. It also seems to be slightly more performant.

本文标签： javascriptDifference between bind and var selfthisStack Overflow