摘要：是什么本質是一個綁定，在函數被調用時建立。它的指向是完全由函數被調用的調用點來決定的。因為函數的調用點在全局作用域，所以指向全局變量這里就是函數的調用點存在的意義在函數體內部指代函數當前的運行環境。從而實現干凈的設計和更容易的復用。

this 本質是一個綁定， 在函數被調用時建立。它的指向是完全由函數被調用的調用點來決定的。

function baz() {
    console.log(this);//因為baz函數的調用點在全局作用域，所以this指向全局變量
}
baz();//這里就是baz函數的調用點

在函數體內部指代函數當前的運行環境。從而實現干凈的 API 設計和更容易的復用。

top-level scope

   1) In browsers, the top-level scope is the global scope. This means that within the browser var something will define a new global variable.In Node.js this is different. The top-level scope is not the global scope; var something inside a Node.js module will be local to that module. 
   2) 但是在Node REPL下，與瀏覽器的行為保持一致(timers除外)
       In browsers
           var that = this;
           setTimeout(function() {
             console.log(this);//window
           }, 0);
        Node REPL
           var that = this;
           setTimeout(function() {
             console.log(this);//Timeout {...}
           }, 0);   
       setInterval 結果相同

嚴格模式下

   指定的this不在被封裝為對象，而且如果沒有指定this，則this的值為undefined
   sloppy mode
       function foo() {
         console.log(this);
       }
       foo.apply("test"); //==>String?{"test"}0: "t"1: "e"2: "s"3: "t"length: 4...[[PrimitiveValue]]: "test"
    strict mode    
       function foo() {
         "use strict";
         console.log(this);
       }
       foo.apply("test"); //==>test        

調用方法時沒有明確對象,this指向全局對象

   sloppy mode
       In browsers，this指向window
           console.log(this);//window
       Node REPL, this指向global
           console.log(this);//global
   strict mode
       In browsers，this指向window
           "use strict";
           console.log(this);//window
       Node REPL, this指向global
           "use strict";
           console.log(this);//global            

匿名函數執行時當前對象是全局對象

   sloppy mode
       In browsers，
           (function() {
             console.log(this);//window
           })();
       Node REPL
           (function() {
             console.log(this);//global
           })(); 
   strict mode
       In browsers，
           (function() {
             "use strict";
             console.log(this);//undefined
           })();
       Node REPL
           (function() {
             "use strict";
             console.log(this);//undefined
           })(); 

強制一個函數調用使用某個特定對象作為 this 綁定,而不在這個對象上放置一個函數引用屬性
就 this 綁定的角度講，call(..) 和 apply(..) 是完全一樣的
call

   function foo() {
     console.log(this.a);
   }
   var obj = {
     a: 2
   };
   foo.call(obj); //==>2 強制函數foo()的 this 指向 obj

apply

   function foo() {
     console.log(this.a);
   }
   var obj = {
     a: 2
   };
   foo.apply(obj); //==>2 強制函數foo()的 this 指向 obj     
    
bind 返回一個硬編碼的新函數，它使用你指定的 this 環境來調用原本的函數
   function foo(something) {
     console.log(this.a, something);
     return this.a + something;
   }
   var obj = {
     a: 2
   };
   var a = 6;
   var bar = foo.bind(obj);//使用obj作為this環境調用foo()
   var b = bar(3); // 2 3
   console.log(b); // 5
   var test = bar.bind(window);//2 3 
   console.log(test(3)); // 5
   

傳遞 null 或 undefined 作為 call、apply 或 bind 的 this 綁定參數，那么這些值會被忽略掉。

   sloppy mode
       function foo() {
         console.log(this);
       }
       var obj = {};
       foo.call(null);//window or global
       foo.apply(null);//window or global
       var bar = foo.bind(null);
       console.log(bar());//window or global
    strict mode
       "use strict";
       function foo() {
         console.log(this);
       }
       var obj = {};
       foo.call(null);//null
       foo.apply(null);//null
       var bar = foo.bind(null);
       console.log(bar());//null        

new

   將新構建的對象被設置為函數調用的 this 綁定
   function foo(a) {
     console.log(this);
     this.a = a;
   }
   var bar = new foo(2);//構建了一個新的對象(foo?{a: 2})并把這個新對象作為 foo(..) 調用的 this
   console.log(bar); //foo?{a: 2}
   console.log(bar.a); // 2
   

arrow functions

   箭頭函數從封閉它的（函數或全局）作用域采用 this 綁定
   function foo() {
     // 返回一個箭頭函數
     return (a) => { //箭頭函數在詞法上捕獲 foo() 被調用時的 this(obj1)
       // 這里的 `this` 是詞法上從 `foo()` 采用的
       console.log(this.a);
     };
   }
   var obj1 = {
     a: 2
   };
   var obj2 = {
     a: 3
   };
   var bar = foo.call(obj1);
   bar.call(obj2); //2
   
   

Refer：

  https://github.com/CuiFi/You-Dont-Know-JS-CN
  https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/this