10 minutes thoroughly understand JavaScript this point, do not understand please smash shop

The This of the function refers to who, and where the function is defined, where the function is executed without a semi-gross money relationship, only follows the following rules:

In non-strict mode:

1, self-executing function inside, this always points to window;

 <script> var  a = 1;  var  o = {a:  2 function   () { The self-executing function, when defined, has been executed console.log ( ' self-executing function is window ', this  .a); The This in the self-executing function points to the window  return  fun                    ction   () {///But here's this pointer to the function who called this                Console.log ( ' but still specific problem specific analysis ', this  .a)    }}) ()} O.fn ();  </script> 

Results please see

2, to a certain behavior of the element binding method, when the behavior triggers the called function inside this pointer to the DOM element;

    <script>        var dd = document.getElementById (' dd ');         function F1 () {            Console.log (this);        }        Dd.onclick=F1;       The DOM    object that you clicked </script>

But if I change it a little bit:

    <script>        var dd=document.getelementbyid (' DD ');         function fn () {            Console.log (this);        }        Dd.onclick=function() {            Console.log (this);   Dom Object            fn ();                // window  , it's time to see who called the     function. </script>

3, look at the function of the execution has a BAA. , if there is one, the front, if not, the window.

4, in the constructor, this point is the current instance;

<script>functionfn () {Console.log ( This);       }; functionff () { This. name= "Du Juncheng";  This. say=function() {Console.log ( This);//this refers to the prototype of the constructorFN ()//window, because the direct caller of the FN function is window,             }       }       varA =NewFF ();    A.say (); </script>

5. Use call/apply to change the direction of this; (about call and apply want to get it all once and for all?) Please look at one of my articles)

Strict mode:

1, self-executing function inside, this always points to undefined;

<script>varobj ={fn: (function(){                //This = undefinedConsole.log ( This)                return function(){                    //this=> OBKConsole.log ( This); }}) ()} Obj.fn; //The Obj.fn method was executed at the time of the Declaration, windowObj.fn ();//Obj.fn The method returned by the self-executing method executes obj</script>

2, look at the front there are baa. , if there is the one in front, if not, it is undefined.

The summary is: The difference between strict mode and non-strict mode: When the calling body is unknown, strict mode is undefined, and non-strict mode is window

<script> ' use strict '; functionfn () {alert ( This); }    /*non-strict mode*/Fn.call ()//This-window;Fn.call (NULL)//This-window;Fn.call (undefined);//this-undefined    /*Strict mode, to call or apply the first parameter of who this is who, not preach is undefined*/Fn.call ()//this-undefined;Fn.call (NULL)//This-null;Fn.call (undefined)//this-undefined</script>

Finally play a small ad, I Wuhan University junior students, love the front-end development, has half a year of project experience and internship experience, to many companies at home and abroad to do the front-end outsourcing work;

For Beijing, Shanghai, Hangzhou, the company's internship, ask you front-end big boys fly;

GitHub Address: Https://github.com/dujuncheng

10 minutes thoroughly understand JavaScript this point, do not understand please smash shop