This,this, discuss this in JavaScript again, Super Comprehensive (classic) _javascript tips

JavaScript is a scripting language, so it is considered easy to learn by many people. On the contrary, however, JavaScript supports advanced features such as functional programming, closures, prototype inheritance, and so on. This article only picks one example: The This keyword in JavaScript, explains in a very simple way what it means in different situations, why this happens, and how the binding this is provided in JavaScript tools such as Dojo. It can be said that the right to grasp the JavaScript in the This keyword, only to enter the language of JavaScript threshold.

As for JS this thing, a lot of adultery explained, looks good high-end appearance, do not know you understand wood?

First quote the more high-end, cloud-dwelling community, yes this

Okay, here's a little bit of an explanation.

Argument: This is not a variable, is not a property, cannot be assigned a value, and it always points to the object that calls it

The feeling is also TM void, just remember the most important one can "it always point to the object that calls it", so find the object that called this, you know this point to WHO

1,

Look, the bounce is whatever, or "object window", or "object" in short, is that object?

The result is ' true ' so the object that is now calling it is window.

2,

var test = function () {
  alert (this);
}

Guess what pops up, isn't it the same as "alert"?

var test = function () {
  alert (this = = window);
 }

Run the above code, is not the "true" pop-up?

Is that the end of the story?

Why are so many people going to talk about this bird if it's so simple?

3,

Again

var test = function () {
  alert (this = = window);
 }

Hey, how ' false ' this time?

Remember, "This always points to the object that called it," 1, "the immediate object in which the code is invoked is the global object, which is" window "; the first" 2, "is a function, but the call to it is still" window "(Don't confuse it, the function is an object, but it's another object to call it) , section "3,", using "new" is actually changed, this is a constructor, the constructor creates a new empty object, that is, "new test ()" Creates a new object, and then the object points to the code in the function "test". So this is not a Window object at this time, but a new object created by the constructor.

4,

var test ={
  ' a ': 1,
  ' B ': function () {
   alert (this = = Test)
  }
 }

With the above argument, this is a clear one!

5,

var test ={
  ' a ': 1,
  ' B ': function () {
   alert (this = = Test)
  }}
var test1 = test;

So, you don't think the result is "false", wrong, although the value of ' test1 ' is ' test ' but ' test1 ' is not a ' test ' object, it has a new object, you understand for the time being quoted, two points to an object, the following code to testify

var test ={
  ' a ': 1,
  ' B ': function () {
   alert (this = = Test)
  }}
var test1 = test;
TEST.A = 2;

If the "1" pops up, you scold me.

6, and then the whole complex

var test ={
  ' a ': 1,
  ' B ': {
   ' B1 ': function () {
    alert (this = = Test)
   ;
 }}}

Is this "true" or "false"?

According to the above theory, at this time "this" is no longer directly by ' test ' call, but by the ' test.b ' call, the following code to testify

var test ={
  ' a ': 1,
  ' B ': {
   ' B1 ': function () {
    alert (this = = test.b)
   ;
 }}}

7, well again the whole complex point of

var test = function () {
  var innertest = function () {
   alert (this = = Test);
  }
  Innertest ();
 }

You don't think that pops up "true", not according to the above theory ' Innertest ' is called by ' test ', and then ' this ' points to ' test '?
Well, wrong is wrong in who called the ' innertest ', in fact, this function is the ' window ' object calls, in time you nest 1000 layers, call each function is a ' window ' object, the following code as proof

var test = function () {
  var innertest = function () {
   alert (this = = window);
   var innerTest1 = function () {
    alert (this = = window);
   }
   InnerTest1 ();
  }
  Innertest ();
 }

8. Another special

var test = function () {
  alert (this = = window);
 }
var test1 = {
}

I don't think anyone would guess that's the function of "calling one method of an object, replacing the current object with another" so the ' window ' object has been substituted for ' test1 ', which is naturally ' false ', with the following code as proof

var test = function () {
  alert (this = = Test1);
 }
 var test1 = {
  }

So, things like ' call ' are similar.

9, again a prototype of the inheritance, different from the literal number of inheritance

var test = function () {
 }
 var i = function () {
  THIS.A = function () {
   alert (this = = Mytest2);
  }
 }
 var mytest = new My ();
 Test.prototype = mytest;
 var mytest2 = new Test ();
 

10, what is left, may be the ' Dom ' object

<script>
  var mytest = function (context) {
   alert (context.getattribute (' id '));
   Alert (this = = window);
  }
 </script>
 

Read the above should understand it, the inside of ' this ' to represent God horse