摘要：本文屬于原創(chuàng)狂票，歡迎轉(zhuǎn)載，轉(zhuǎn)載請(qǐng)保留出處：https://github.com/jasonGeng88/blog
this是什么
如果通過this的英文解釋，很容易誤導(dǎo)this的意思。它實(shí)際是在函數(shù)被調(diào)用時(shí)才綁定的贩幻，也就是說this具體指向什么，取決于你是怎么調(diào)用的函數(shù)两嘴。
this的四種綁定規(guī)則
this的四種綁定規(guī)則分別是：默認(rèn)綁定丛楚，隱式綁定，顯示綁定憔辫，New綁定趣些。
默認(rèn)綁定
沒有其他綁定規(guī)則存在時(shí)的默認(rèn)規(guī)則，這是函數(shù)調(diào)用中最常見的規(guī)則贰您。
function foo() {
} console.log( this.a );
var a = 2;
foo(); //打印的是什么坏平？
打印的是：2；
因?yàn)閒oo是直接調(diào)用的锦亦，沒有應(yīng)用其他綁定規(guī)則舶替，這里進(jìn)行了默認(rèn)綁定，將全局對(duì)象綁定在this上杠园，所以this.a就解析成了全局變量（window）中的a
注意：在嚴(yán)格模式下顾瞪，全局變量無法使用默認(rèn)綁定，即執(zhí)行上面代碼會(huì)報(bào)undefined的錯(cuò)誤抛蚁。
function foo() {
"use strict";
console.log( this.a );
}
var a = 2;
foo(); // Uncaught TypeError: Cannot read property 'a' of undefined
隱式綁定
除了之間對(duì)函數(shù)進(jìn)行調(diào)用外陈醒，有些函數(shù)的調(diào)用是在對(duì)象上觸發(fā)的（即比如對(duì)象的方法），即調(diào)用位置上存在上下文對(duì)象瞧甩。
function foo() {
console.log( this.a );
}
var a = 2;
var obj = {
a: 3,
foo: foo
};
obj.foo(); // ?
返回的結(jié)果是：3钉跷；
這里foo函數(shù)被當(dāng)做引用屬性，被添加到obj對(duì)象上肚逸。這里的調(diào)用過程是這樣的：
獲取obj.foo屬性 --> 根據(jù)引用關(guān)系找到foo函數(shù)爷辙，執(zhí)行調(diào)用
所以這里對(duì)foo的調(diào)用存在上下文對(duì)象obj彬坏，this進(jìn)行了隱式綁定，即this綁定到了obj上膝晾，所以this.a被解析成了obj.a苍鲜，即3。
多層調(diào)用鏈
function foo() {
console.log( this.a );
}
var a = 2;
var obj1 = {
a: 4,
foo: foo
};
var obj2 = {
a: 3,
obj1: obj1
};
obj2.obj1.foo(); //?
返回的結(jié)果是：4玷犹；
同樣棒动，我們看下函數(shù)的調(diào)用過程：
先獲取obj2.obj1 -> 通過引用獲取到obj1對(duì)象竿报，再訪問 obj1.foo -> 最后執(zhí)行foo函數(shù)調(diào)用.
這里調(diào)用鏈不只一層蒋情，存在obj1昙篙、obj2兩個(gè)對(duì)象枉长，那么隱式綁定具體會(huì)綁哪個(gè)對(duì)象呢饰豺？這里原則是獲取最后一層調(diào)用的上下文對(duì)象连茧，即obj2腹侣，所以結(jié)果是4（obj1.a）乏德。
隱式丟失（函數(shù)別名）
注意：這里存在一個(gè)陷阱撤奸，大家在分析調(diào)用過程時(shí)，要特別小心喊括。
先看個(gè)代碼：
function foo() {
console.log( this.a );
}
var a = 2;
var obj = {
a: 3,
foo: foo
};
var bar = obj.foo;
bar(); //?
返回的結(jié)果是：2胧瓜；
這里有個(gè)概念要理解清楚，obj.foo 是引用屬性郑什，賦值給bar的實(shí)際上就是foo函數(shù)（即：bar指向foo本身）府喳。
foo并不是在obj這個(gè)對(duì)象上下文中調(diào)用的，而是把obj.foo的值蘑拯，即foo函數(shù)的地址钝满，賦值給bar。bar直接指向foo函數(shù)申窘。
那么弯蚜，實(shí)際的調(diào)用關(guān)系是：通過bar找到foo函數(shù)，進(jìn)行調(diào)用剃法。整個(gè)調(diào)用過程并沒有obj的參數(shù)碎捺，所以是默認(rèn)綁定，全局屬性a贷洲。
隱式丟失（回調(diào)函數(shù)）
function foo() {
console.log( this.a );
}
var a = 2;
var obj = {
a: 3,
foo: foo
};
setTimeout( obj.foo, 100 ); // 牵寺？
返回的結(jié)果是：2；
和上面一樣恩脂，回調(diào)傳的也是函數(shù)的地址帽氓，所以沒有綁定obj對(duì)象，進(jìn)行的依然是默認(rèn)綁定俩块。（雖然參傳是obj.foo黎休，因?yàn)槭且藐P(guān)系浓领，所以傳參實(shí)際上傳的就是foo對(duì)象本身的引用。）
顯示綁定
相對(duì)隱式綁定势腮，this值在調(diào)用過程中會(huì)動(dòng)態(tài)變化联贩，可是我們就想綁定指定的對(duì)象，這時(shí)就用到了顯示綁定捎拯。
顯示綁定主要是通過改變對(duì)象的prototype關(guān)聯(lián)對(duì)象泪幌，這里不展開講。具體使用上署照，可以通過這兩個(gè)方法call(…)或apply(…)來實(shí)現(xiàn)（大多數(shù)函數(shù)及自己創(chuàng)建的函數(shù)默認(rèn)都提供這兩個(gè)方法）祸泪。
call與apply是同樣的作用，區(qū)別只是其他參數(shù)的設(shè)置上
function foo() {
console.log( this.a );
}
var a = 2;
var obj1 = {
a: 3,
};
var obj2 = {
a: 4,
};
foo.call( obj1 ); // ?
foo.call( obj2 ); // ?
打印的結(jié)果是3, 4建芙。
這里因?yàn)轱@示的申明了要綁定的對(duì)象没隘，所以this就被綁定到了obj上，打印的結(jié)果自然就是obj1.a 和obj2.a禁荸。
硬綁定
function foo() {
console.log( this.a );
}
var a = 2;
var obj1 = {
a: 3,
};
var obj2 = {
a: 4,
};
var bar = function(){
foo.call( obj1 );
}
setTimeout( bar, 100 ); // 3
bar.call( obj2 ); // 這是多少
前面兩個(gè)（函數(shù)別名右蒲、回調(diào)函數(shù)）打印3，因?yàn)轱@示綁定了赶熟，沒什么問題瑰妄。
最后一個(gè)打印是3。
這里需要注意下映砖，雖然bar被顯示綁定到obj2上翰撑，對(duì)于bar，function(){…} 中的this確實(shí)被綁定到了obj2啊央，而foo因?yàn)橥ㄟ^foo.call( obj1 )已經(jīng)顯示綁定了obj1眶诈，所以在foo函數(shù)內(nèi)，this指向的是obj1瓜饥，不會(huì)因?yàn)閎ar函數(shù)內(nèi)指向obj2而改變自身逝撬。所以打印的是obj1.a（即3）。
new 綁定
js中的new操作符乓土，和其他語言中（如JAVA）的new機(jī)制是不一樣的宪潮。js中，它就是一個(gè)普通函數(shù)調(diào)用趣苏，只是被new修飾了而已狡相。
使用new來調(diào)用函數(shù)，會(huì)自動(dòng)執(zhí)行如下操作：
如果函數(shù)沒有返回其他對(duì)象,那么new表達(dá)式中的函數(shù)調(diào)用會(huì)自動(dòng)返回這個(gè)新對(duì)象食磕。
this指向的就是對(duì)象本身尽棕。
看個(gè)代碼：
function foo(a) {
this.a = a;
}
var a = 2;
var bar1 = new foo(3);
console.log(bar1.a); // ?
var bar2 = new foo(4);
console.log(bar2.a); // ?
最后一個(gè)打印是3, 4。
因?yàn)槊看握{(diào)用生成的是全新的對(duì)象彬伦，該對(duì)象又會(huì)自動(dòng)綁定到this上滔悉，所以答案顯而易見伊诵。
箭頭函數(shù)
箭頭函數(shù)的this綁定只取決于外層（函數(shù)或全局）的作用域
