摘要：的幾種用法關(guān)于是什么理論上是執(zhí)行上下文的一個屬性，的值在進入到執(zhí)行上下文的時候就已經(jīng)確定了，且不會再改變。默認綁定這種情況下，不屬于任何一個函數(shù)方法內(nèi)，即在全局作用域下，這種情況下稱為默認綁定。最后的總結(jié)用偽代碼的形式來表示例外例外本文參考

this是什么？

理論上this是執(zhí)行上下文的一個屬性，this的值在進入到執(zhí)行上下文的時候就已經(jīng)確定了，且不會再改變。這一點很重要。

this的作用？

this 的機制提供了一個優(yōu)雅的方式，隱式地傳遞一個對象，這可以讓函數(shù)設(shè)計的更加簡潔，并且復(fù)用性更好。

new綁定，this指向由new創(chuàng)建的對象

顯示綁定，this指向apply或者call函數(shù)的第一個參數(shù)

隱式綁定，this指向函數(shù)的調(diào)用者。

默認綁定，嚴格模式下指向undefinded，非嚴格模式this指向全局對象。

箭頭函數(shù)綁定，this指向箭頭函數(shù)外邊包裹的普通函數(shù)

當用new創(chuàng)建一個新的對象的時候，this指向了由new關(guān)鍵字聲明創(chuàng)建的對象。

class Person(name){
    constructor(name){
        this.name = name;
    }
    showThis(){
        return this;
    }
}
var p1 = new Person("zhang");
var p2 = new Person("zhao");
console.log(p1.showThis() === p1);    //true
console.log(p2.showThis() === p2);    //true
console.log(p1.showThis() === Persion)    //false

可以看到，這種情況下this的值指向了由new創(chuàng)建的對象的引用。this會被綁定到這個對象上去。

所謂的顯式綁定，指的是通過apply或者call方法的第一個參數(shù)。

call和apply的不同，兩個方法的第一個參數(shù)都是this賦給的對象。不同在于，之后的參數(shù)被當作call方法的形參依次傳進去，而apply則是接受一個數(shù)組。

看代碼：

function foo(){
    console.log(this === obj);     //true
    console.log(this.a === 2);     //true
}

var obj = {
    a:2
}

foo.call(obj);

隱式綁定用的次數(shù)比較多。一個最重要的特點就是，this的指定順序和在哪里定義沒有關(guān)系，而是取決于調(diào)用者。

嚴格意義來說，this是上下文里的一個屬性（存放各種變量的變量對象同樣也是上下文里的屬性），this的值總是指向當前上下文的父級上下文，其實也就是當前上下文的調(diào)用者。

看代碼：

//第一個簡單的例子
var obj = {
    a : 1,
    foo : function(){
        console.log(this === obj);     //trun
        console.log(this.a === 1);     //true
    },
    bar : bar
}

//假如把一個屬性定義在對象外邊
function bar(){
    console.log(this === obj);      //true
}

obj.foo();
obj.bar();     //都是true

再來一個例子

function bar(){
    console.log(this === obj1);
    console.log(this === obj2);
}
function foo(){
    console.log(this === obj1);
    console.log(this === obj2);
}

var obj1 = {
    bar: bar,
    foo: foo
}

var obj2 = {
    bar: obj1.bar,
    foo: obj1.foo,
}

obj1.foo();     //true  false
obj2.foo();     //false  true
obj1.bar();     //true  false
obj2.foo();     //false  true

很簡單，foo和bar兩個方法分別由obj1和obj2調(diào)用，哪怕obj2中的foo和bar是obj1的也沒關(guān)系，與在哪里定義沒有關(guān)系，純粹看是看誰調(diào)用的，obj2.foo()就是obj2調(diào)用的foo方法，所以，這個時候this指向obj2。

多說一句，如果既有顯示綁定又有隱式綁定，當然是以顯示綁定為準。

這種情況下，this不屬于任何一個函數(shù)方法內(nèi)，即在全局作用域下，這種情況下稱為默認綁定。

非嚴格模式下，這個時候this值為window全局對象。

function foo(){
    console.log(this === window);
}

foo();

嚴格模式下，this的值是undefined

"use strict";

function foo() {
  console.log( this === undefined );
}

foo();               // true
foo.call(undefined); // true
foo.call(null);      // false

箭頭函數(shù)其實是一個語法躺，箭頭函數(shù)的里的this指向包裹箭頭函數(shù)的那個函數(shù)的this值。很好理解。

// ES6
function foo() {
  setTimeout(() => {
    console.log(this === obj); // true
  }, 100);
}

const obj = {
  a : 1
}

foo.call(obj);

// ES5
function foo() {
  var _this = this;

  setTimeout(function () {
    console.log(_this === obj); // true
  }, 100);
}

var obj = {
  a : 1
}

foo.call(obj);

用偽代碼的形式來表示

if (`newObj = new Object()`) {
  this = newObj
} else if (`bind/call/apply(thisArgument,...)`) {
  if (`use strict`) {
    this = thisArgument
  } else {
    if (thisArgument == null || thisArgument == undefined) {
      this = window || global
    } else {
      this = ToObject(thisArgument)
    }
  }
} else if (`Function Call`) {
  if (`obj.foo()`) {
    // base value . Reference = base value + reference name + strict reference
    // 例外： super.render(obj).  this = childObj ?
    this = obj 
  } else if (`foo()`) {
    // 例外： with statement. this = with object?   
    this = `use strict` ? undefined : window || global
  }
}

本文參考