摘要：與方法這兩個(gè)方法的第一個(gè)參數(shù)是一個(gè)對(duì)象，是給準(zhǔn)備的，接著在調(diào)用函數(shù)時(shí)將其綁定到。作為事件處理函數(shù)當(dāng)函數(shù)被用作事件處理函數(shù)時(shí)，它的會(huì)指向觸發(fā)事件的元素。總結(jié)在任何函數(shù)體外部，無(wú)論是否在嚴(yán)格模式，都指代全局對(duì)象。

this在JavaScript中似乎可以視而不見(jiàn)，但不去正視它學(xué)到的就只是殘缺的JS。拋開(kāi)這些“形而上”的意義不說(shuō)，從實(shí)用性及代碼簡(jiǎn)潔展示this的不可或缺的地位，舉例子：

function identifyUser () {
  return this.name.toUpperCase();
}

let obj1 = {
  name: leeper;
}

let obj2 = {
  name: Sandman;
}

identifyUser.call(obj1) // -> LEEPER
identifyUser.call(obj2) // -> SANDMAN

如果不使用this，就需要給identifyUser()顯示傳入一個(gè)上下文對(duì)象，但隨著使用模式的增加，顯示傳遞上下文對(duì)象成了”噩夢(mèng)“，讓代碼也變得越來(lái)越混亂。為了將API設(shè)計(jì)得更加簡(jiǎn)潔并易于復(fù)用，就必須正視this。

如果在任何函數(shù)體外部，無(wú)論是否在嚴(yán)格模式，this都指代全局對(duì)象。這里著重討論的是函數(shù)體內(nèi)部的this。JavaScript的this總是指向一個(gè)對(duì)象，具體指向哪個(gè)對(duì)象是在運(yùn)行時(shí)基于函數(shù)的執(zhí)行環(huán)境動(dòng)態(tài)綁定的，而非函數(shù)被聲明時(shí)的環(huán)境。

在函數(shù)內(nèi)部，this的綁定和函數(shù)聲明的位置沒(méi)有任何關(guān)系，只取決于函數(shù)的調(diào)用方式：

作為普通函數(shù)調(diào)用

this的值默認(rèn)指向全局對(duì)象：

let a = 233;
function foo () {
  console.log(this.a);
}
foo() // -> 233

但在嚴(yán)格模式下，this默認(rèn)為undefined；

作為對(duì)象的方法調(diào)用

函數(shù)調(diào)用時(shí)會(huì)綁定到上下文對(duì)象：

let obj = {
  a: 233,
  foo: foo
};
function foo () {
  console.log(this.a);
}
obj.foo(); // -> 233

對(duì)象引用鏈中只有在最后一層調(diào)用位置中起作用：

function foo () {
  console.log(this.a);
}
let obj1 = {
  a: 233,
  foo: foo
};
let obj2 = {
  a: 2333,
  obj1: obj1
}
obj2.obj1.foo() // -> 233

bind方法

在講bind之前不得不先提兩種綁定丟失的情況：

// 第一種

function foo () {
  console.log(this.a);
}
var obj = {
  a: 233,
  foo: foo
};
var bar = obj.foo;
var a = "global a";
bar(); // -> "global a"

// 雖然bar是obj.foo的一個(gè)引用，但實(shí)際上，它引用的foo函數(shù)本身，作為普通函數(shù)直接調(diào)用，非嚴(yán)格模式下，this指向全局對(duì)象。

// 第二種
function foo () {
  console.log(this.a);
}
var obj = {
  a: 233,
  foo: foo
};
var a = "global a";
function doFn(fn) {
  fn();
}
doFn(obj.foo); // -> "global a"

function foo () {
  console.log(this.a);
}
var obj = {
  a: 233,
  foo: foo
};
var a = "global a";
setTimeout(obj.foo, 0) // -> "global a"

參數(shù)傳入的是函數(shù)，作為普通函數(shù)調(diào)用，會(huì)導(dǎo)致被傳入的這個(gè)函數(shù)this綁定丟失，this會(huì)指向默認(rèn)的全局對(duì)象。
bind方法可以解決上this綁定丟失的情況：

function foo () {
  console.log(this.a);
}
var obj = {
  a: 233,
  foo: foo
};
var a = "global a";
var bar = foo.bind(obj);
function doFn (fn) {
  fn();
}
doFn(bar); // -> 233

fn.bind(某個(gè)對(duì)象)會(huì)創(chuàng)建一個(gè)與fn具有相同函數(shù)體和作用域的新函數(shù)，在這個(gè)新函數(shù)中，this將永久地綁定到了bind的第一個(gè)參數(shù)，無(wú)論這個(gè)函數(shù)如何被調(diào)用。

call與apply方法

這兩個(gè)方法的第一個(gè)參數(shù)是一個(gè)對(duì)象，是給this準(zhǔn)備的，接著在調(diào)用函數(shù)時(shí)將其綁定到this。

let obj = {
  a:233
};
function foo () {
  console.log(this.a);
}
foo.call(obj) // -> 233

this綁定角度看，apply方法與call方法，區(qū)別在于其他參數(shù)上。

作為構(gòu)造函數(shù)調(diào)用

使用new來(lái)調(diào)用函數(shù)時(shí)，會(huì)自動(dòng)執(zhí)行下面操作：

- 構(gòu)造一個(gè)全新的對(duì)象；
- 構(gòu)造出的新對(duì)象會(huì)被執(zhí)行[[Prototype]]連接；
- 新對(duì)象會(huì)綁定到函數(shù)調(diào)用的this;
- 如果函數(shù)沒(méi)有返回其他對(duì)象，那么表達(dá)式中的函數(shù)調(diào)用會(huì)自動(dòng)返回這個(gè)新對(duì)象。

  function foo (a) {
 this.a = a;
  }
  var bar = new foo(233);
  console.log(bar.a); // -> 233

使用new來(lái)調(diào)用foo()時(shí)，會(huì)構(gòu)造一個(gè)新對(duì)象并把它綁定到foo()調(diào)用中的this上。

作為DOM事件處理函數(shù)

當(dāng)函數(shù)被用作事件處理函數(shù)時(shí)，它的this會(huì)指向觸發(fā)事件的元素。

箭頭函數(shù)

箭頭函數(shù)會(huì)繼承外層函數(shù)調(diào)用的this綁定，在全局作用域中則會(huì)綁定到全局對(duì)象上。

function foo () {
  setTimeout(() => {
    console.log("a", this.a);
    }, 0);
}
var a = "global a";
foo.call({a: 233}); // -> 233

如果是普通函數(shù)，執(zhí)行時(shí)this應(yīng)該指向全局對(duì)象，輸出的"global a"，而箭頭函數(shù)this繼承它的外層foo函數(shù)的this綁定，由于使用call方法將foo函數(shù)的this綁定指向{a: 233}，所以輸出233。

函數(shù)是否在new中調(diào)用？如果是的話(huà)，this綁定的是新創(chuàng)建的對(duì)象；

函數(shù)是否通過(guò)call, apply或者bind綁定調(diào)用？如果是，this綁定的是指定的對(duì)象；

函數(shù)是否在某個(gè)上下文對(duì)象中調(diào)用（ var bar = obj.foo() ）？如果是，this綁定到那個(gè)上下文對(duì)象；

如果都不是，考慮是否是默認(rèn)綁定，綁定到全局對(duì)象。如果是在嚴(yán)格模式下，則綁定到undefined。

在任何函數(shù)體外部，無(wú)論是否在嚴(yán)格模式，this都指代全局對(duì)象。

在函數(shù)內(nèi)部，this的綁定和函數(shù)聲明的位置沒(méi)有任何關(guān)系，只取決于函數(shù)的調(diào)用方式。

箭頭函數(shù)會(huì)繼承外層函數(shù)調(diào)用的this綁定，在全局作用域中則會(huì)綁定到全局對(duì)象上。