js中修改this的指向方法匯總【新版】

js中修改this的指向方法整理

方法一：call

使用方法：fun.call(thisArg[,arg1[, arg2[, ...]]])

該方法傳遞一個thisArgs和一個參數(shù)列表，thisArgs制定了函數(shù)在運(yùn)行中的調(diào)用者，也就是函數(shù)中的this對象，而參數(shù)列表會被傳入調(diào)用函數(shù)中。

call 方法可以在一個對象上借用另一個對象的方法

案例：Object.prototype.tostring.call([])。一個Array對象借用了Object對象上的方法

thisArgs的取值情況：

(1)不傳，或者傳null，undefined，函數(shù)中的this指向window對象。

(2)傳遞另一個函數(shù)的函數(shù)名，函數(shù)中的this指向這個函數(shù)的引用

(3)傳遞字符串，數(shù)值或者不二類型的那個基礎(chǔ)數(shù)據(jù)類型，函數(shù)中的this指向其對應(yīng)的包裝對象，如string，number，boolean

(4)傳遞一個對象，函數(shù)中的this指向這個對象。

這是call的核心功能，它允許你在一個對象上調(diào)用該對象沒有定義的方法，并且這個方法可以訪問該對象中的屬性。

還可以通過call方法來調(diào)用匿名函數(shù)

在下例中的for循環(huán)體內(nèi)，我們創(chuàng)建了一個匿名函數(shù)，然后通過調(diào)用該函數(shù)的call方法，將每個數(shù)組元素作為指定的this值執(zhí)行了那個匿名函數(shù)。這個匿名函數(shù)的主要目的是給每個數(shù)組元素對象添加一個print方法，這個print方法可以打印出各元素在數(shù)組中的正確索引號。當(dāng)然，這里不是必須得讓數(shù)組元素作為this值傳入那個匿名函數(shù)(普通參數(shù)就可以)，目的是為了演示call的用法。

方法二：apply()方法

fun.apply(thisArg, [argsArray])

apply和call的唯一區(qū)別是第二個參數(shù)的傳遞方式不同，apply的第二個參數(shù)必須是一個數(shù)組，而call允許傳遞一個參數(shù)列表。值得你注意的是，雖然apply接收的是一個參數(shù)數(shù)組，但在傳遞給調(diào)用函數(shù)時，卻是以參數(shù)列表的形式傳遞。

注意：這里的argsArray可以是一個數(shù)組或者類數(shù)組對象，如果該參數(shù)的值為null 或 undefined，則表示不需要傳入任何參數(shù)。

apply方法的實(shí)用寫法

當(dāng)參數(shù)是明確知道數(shù)量時用call;不確定的時候用apply，然后把參數(shù)push進(jìn)數(shù)組傳遞進(jìn)去，也可以通過arguments這個數(shù)組來遍歷所有的參數(shù)。

方法三：bind()方法

fun.bind(thisArg, [arg1, [arg2, [...]]])

bind是ES5新增的一個方法，它的傳參和call類似，但又和call/apply有著顯著的不同，即調(diào)用call或apply都會自動執(zhí)行對應(yīng)的函數(shù)，而bind不會執(zhí)行對應(yīng)的函數(shù)，只是返回了對函數(shù)的引用。

ES5中新增加的bind方法可以彌補(bǔ)call()和apply()方法的不足，由于call/apply會對目標(biāo)函數(shù)自動執(zhí)行，從而導(dǎo)致它無法在事件綁定函數(shù)中使用，因?yàn)槭录壎ê瘮?shù)不需要我們手動執(zhí)行，它是在事件被觸發(fā)時由JS內(nèi)部自動執(zhí)行的。而bind在實(shí)現(xiàn)改變函數(shù)this的同時又不會自動執(zhí)行目標(biāo)函數(shù)，因此可以完美的解決上述問題，我們來看看一個例子：

猜你喜歡：

前端touch事件方向的判斷

好用的前端開發(fā)工具：這四款你必須知道！

v-show和v-if有什么區(qū)別？