Talking about this in js objects (not full complement)

What is this?

  1.javascript language, everything is an object (in addition to the undefined and null), the operating environment is an object, so functions are run in an object, this is the object (environment).

  2.this point is dynamic. If the function in the global scope, then this will be directed to the global environment; If the function is located in an object, then this would point to the object.

  3. The same with the new keywords, the this keyword always returns an object

 

First, you must figure out some way to call the JS inside, in function of:

  • Ordinary function call

  • As a method to invoke

  • As a constructor to call

  • Use apply / call method to invoke

  • Function.prototype.bind method

  • es6 arrow function

But no matter which method is based on the function to call, please keep in mind: Who calls this function or method, this key points to anyone .

this usage scenarios

1. The global environment (global scope)

      Use this object in global scope, it points to is the top-level object, that is, the window object.

    

function person () {
         the this .name = "XL" ; 
        the console.log ( the this ); 
         the console.log ( the this .name); 
     } 
     person ();   // output XL window 

    // In this code as a function of an ordinary person function call, in fact person as a way of global object window to make the call, that window.person (); 
    // so this place is a window object to call a person method, then the person function which refers to this window, at the same time window also has another attribute name, value XL. 

     var name = "XL" ;
      function Person () { 
         the console.log ( the this .name); 
     } 
     Person (); // output XL 

     //This same place as the person to call a method of the window, at the beginning of the code defines a global variable name, the value of XL, which corresponds to a property of the window, i.e. window.name = "xl", 
    and because the calling person when this point is a window, so here is output XL.
// in the above code, the ordinary function call, i.e. a method is invoked as window object. Obviously this keyword refers to the window object.

   The above code, whether or not inside a function, in the long run global scope, this is the point to top-level object window.

  2. As a method to call:

    When the function is saved as properties of an object, which can be called the method of this object. When a method is called, this is bound to this object.

    (. Or []) if a call operation expression containing the extracted attribute, then it is called method calls;

  var name = "XL" ;
        var Person = { 
        name: "XL" , 
        showname: function () { 
            the console.log ( the this .name); 
        } 
    } 
    person.showName ();   // output XL 
   // // here person object calls showName method, it is clear that this is a key point person objects, it will output name 
    
    var showNameA = person.showName; 
    showNameA ();     // output XL 
    // here person.showName method assigns showNameA variables, this when showNameA variable corresponds to a property of the window object, so showNameA () execution time equivalent window.showNameA (), ie the window object calls showNameA this method, so this keyword refers window 
//================================================== ============== 

    var personA = { 
        name: "XL" , 
        showname: function () { 
            the console.log ( the this .name); 
        } 
    } 
    personA.showName ();   // output XL; this is called personA showName, so this point parsonA 

    var personB = { 
        name: "XL" , 
        sayName: personA.showName 
    } 
    
    personB.sayName ();   // output XL 
    // Although showname method this object is personA definitions, but when the call is called personB this object, so this object points to personB;

 

3. The following charge money to watch, you want to see, here are!

  

Guess you like

Origin www.cnblogs.com/zhouqingfeng/p/11404658.html