起因
近日穆壕，在網(wǎng)上看了一段講array視頻，視頻內(nèi)容沒啥新意其屏。但是發(fā)現(xiàn)他講解的一個(gè)錯(cuò)誤卻讓我興奮不已喇勋。
大概是這樣的：
const arr = [1, 2, 3, 4, 5];
arr.filter((item, index, arr) => {
console.log(item, index, arr, this)})
解決過程
當(dāng)時(shí)我跟著老師的思路走下去，根據(jù)以往對(duì)this的理解
- 在一般函數(shù)方法中使用 this 指代全局對(duì)象
- 作為對(duì)象方法調(diào)用偎行，this 指代上級(jí)對(duì)象（就近原則川背，嵌套非箭頭函數(shù)指全局）
- 作為構(gòu)造函數(shù)調(diào)用贰拿，this 指代new 出的對(duì)象
- apply、call 調(diào)用和 bind 綁定
如果按照上面規(guī)則熄云，似乎this應(yīng)該指向 arr,然而并沒有膨更。
看一看MDN上關(guān)于filter的講解，
var new_array = arr.filter(callback[, thisArg])
image.png
上面已經(jīng)說的很清楚了缴允，此時(shí)的
this有自己的指定荚守，不是能直接套概念就行的。我順便試了幾個(gè)其他array帶callback參數(shù)的內(nèi)置方法(from练般、map矗漾、reduce)，發(fā)現(xiàn)只要不指定this薄料，其都指向全局敞贡。那這是不是一個(gè)規(guī)律呢? 就目前我的驗(yàn)證來看，如果不用 箭頭函數(shù)摄职，無論這個(gè)內(nèi)置方法能不能指定
this, 這的確是一個(gè)規(guī)律誊役。但是，看下面的代碼：
obj = {
fun: function() {
const arr = [1, 2, 3, 4, 5];
arr.filter((item, index, arr) => {
console.log(item, index, arr, this)}) // this指向 obj
}
}
obj = {
fun: function() {
const arr = [1, 2, 3, 4, 5];
arr.filter(function(item, index, arr){
console.log(item, index, arr, this)}) // this指向 全局
}
}
如果我們用了箭頭函數(shù)琳钉，這個(gè)規(guī)律就不適用了，而跟著箭頭函數(shù)的規(guī)律來蛛倦。
嗯歌懒，好吧，看來this的細(xì)節(jié)還挺多溯壶，箭頭函數(shù)還挺NB及皂，當(dāng)然學(xué)習(xí)的路也還是挺長(zhǎng)的，需要我上下而求索且改。
問題外的驚喜：this is a simple problem
看下面的代碼
var obj = {
bar: function () {
var x = (() => this);
console.log(x())
},
beer: () => this
};
obj.beer(); // this指向哪验烧？
var f = obj.beer;
f(); // this指向哪？
obj.bar(); // this指向哪又跛？
var fn = obj.bar;
fn(); // this指向哪碍拆？
你能分別出this的值分別指向什么嗎？慨蓝？感混？ 驗(yàn)證答案，用控制臺(tái)執(zhí)行一遍礼烈，如果結(jié)果跟自己想的不一樣弧满，那你要再仔細(xì)考慮考慮，如果還是想不明白此熬，請(qǐng)留言庭呜，大家一起討論討論滑进。
