首頁 >web前端 >js教程 >修改JavaScript中的this指向的多種方法

修改JavaScript中的this指向的多種方法

韦小宝
韦小宝原創
2018-03-14 14:44:572608瀏覽

這篇文章講述了修改JavaScript中的this指向多種方法,大家對修改JavaScript中的this指向不了解的話或者對修改JavaScript中的this指向感興趣的話那麼我們就一起來看看這篇文章吧, 好了廢話少說進入正題吧

JavaScript中this的是一個值得深入的話題,下面總結了改變this指向的3種常用方法。先弄清楚函數這個概念:函數本身就是一種特殊類型,要時時明白一點,函數也可以認為是一種變數。

1.透過物件的方法來定義一個函數(誰綁定了我,我就指向誰)

#通俗的話來說,就是如果這個函數是某個物件的方法(key),那麼函數中的this就指向這個物件。

var a = function(obj) 
{ 
    alert(this == obj); 
} 
var obj = {}; 
obj.fun = a; 
obj.fun(obj); //true

這個函數就相當於一個變量,當它被綁定到一個物件的下面,那麼這時候this的指向就會從預設的window物件改變為obj物件。

2.函數被new了一下,創建了新的對象,this指向新的對象(誰new了我,我就指向誰)

#var obj = new a();

透過這語句新建立了一個對象,把函數中的this指向了obj。

3.透過call,apply改變this指向

#1.apply方法

##param1 : show函數中this的指向param2: 一個集合 []

#例:被調函數名.apply(param1, param2);

#回顧第一種方法

var a = function(o) 
{ 
    alert(this == o); 
} 
var obj = {}; 
obj.fun = a; 
obj.fun(obj); //true

簡單的,透過apply一句話搞定

a.apply(obj,[obj]);

2.call方法

param1: show函數中this的指向param2: 第二參數開始都是show函數實際參數
例: 被調函數名.call(param1,param2,param3);

a.call(obj,obj);

簡單實例:

透過each函數為多個元素添加樣式

function each(tagName, callback) {   
    var lists = document.getElementsByTagName(tagName);   
    for (var i = 0; i < lists.length; i++) {   
        callback.apply(lists[i]);   
    }   
}   
each("a", function () {   
    this.style.background = "#ccc";   
}

以上就是本篇文章的所有內容,大家要是還不太了解的話,可以自己多實現兩邊就很容易掌握了哦!



相關推薦:

四個JS中this取值模式

############################################################### javascript函數中的this的四種綁定形式######

以上是修改JavaScript中的this指向的多種方法的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn