this

teren 發(fā)布于2019-08-22 17:12 / 3502人閱讀

摘要：在中一共有四種調(diào)用模式方法調(diào)用模式函數(shù)調(diào)用模式構造器調(diào)用函數(shù)和調(diào)用模式。以此模式調(diào)用函數(shù)時，會被綁定到全局變量，也就是對象。當然這樣的構造器函數(shù)形式我們并不常用。方法讓我們構建一個參數(shù)數(shù)組傳遞給調(diào)用函數(shù)，同時它也允許我們選擇的值。

this

this在面向?qū)ο缶幊踢^程中非常重要，它的值取決于調(diào)用模式。

在js中一共有四種調(diào)用模式：_方法調(diào)用模式、函數(shù)調(diào)用模式、構造器調(diào)用函數(shù)和apply調(diào)用模式_。這四種模式在初始化參數(shù)this上是存在著差異的。

方法調(diào)用模式

當函數(shù)被保存為對象的一個屬性，我們稱之為它的一個方法。

方法調(diào)用模式定義：調(diào)用表達式包含一個提取屬性的動作（即包含一個.點表達式或者[]下標表達式），那么它就是當作一個方法來調(diào)用。

看個簡單的例子：

var name = "window";   
var xiaoming = {
    name: "xiaoming",
    lastname:"wang",
    saylastname:function(){
        console.log(this.lastname)
    }
};
console.log(xiaoming.saylastname()); //wang

方法是可以使用this訪問自己所屬的對象。this對對象的綁定是發(fā)生在調(diào)用的時候?。◤娬{(diào)）是發(fā)生調(diào)用的時候。

這樣通過this取得他們所屬對象的上下文的方法也稱之為公共方法。

函數(shù)調(diào)用模式

函數(shù)調(diào)用模式定義：當一個函數(shù)并非一個對象的屬性時，那么它就是被當作一個函數(shù)來調(diào)用的。以此模式調(diào)用函數(shù)時，this會被綁定到全局變量，也就是window對象。需要??的是，在嚴格模式下，this的值為undefined。

延續(xù)上個模式的例子：

var a = xiaoming.saylastname;
a();  //window

這個例子最好的說明：函數(shù)調(diào)用并非一個對象的屬性，就被當作一個函數(shù)來調(diào)用。

構造器函數(shù)

構造器調(diào)用模式定義：如果創(chuàng)建的目的就是i 希望結(jié)合new關鍵字前綴來調(diào)用，那它就被稱為構造器函數(shù)。

如果在一個函數(shù)前面帶上new來調(diào)用，那么就會創(chuàng)建一個鏈接到該函數(shù)的prototype成員的新對象，同時也會被綁定到哪個欣對象上。

看這個例子：

var Person = function(Name){
        this.name = Name;
    };
//給person的所有對象提供一個公共方法
Person.prototype.say = function(){
    return this.name;
};
//構造一個person實例
var xiaoming = new Person("xiaoming");  
console.log(xiaoming.say()); //xiaoming

在構造區(qū)函數(shù)中，通常會以大寫約定，這樣它們會保存在以大寫格式命名的變量中。這樣的約定會得意更加容易區(qū)分這是構造器函數(shù)變量。

?? 當然這樣的構造器函數(shù)形式我們并不常用。之后我也會介紹更好的替代方式。

apply調(diào)用模式

apply調(diào)用模式定義:函數(shù)可以擁有方法。apply方法讓我們構建一個參數(shù)數(shù)組傳遞給調(diào)用函數(shù)，同時它也允許我們選擇this的值。

簡單的說就時綁定this指向的對象。

apply可以接收2個參數(shù)，參數(shù)1:要綁定給this的值；參數(shù)2:數(shù)組參數(shù)。

看兩個例子：

var add = function(num1,num2){
    return num1 +num2;
}
var arr = [4,5];
var sum = add.apply(null,arr);
console.log(sum); //9

var xiaohong = {
    name:"xiaohong"
}
var xiaohongname = Person.prototype.say.apply(xiaohong);
console.log(xiaohongname); //xiaohong

第一個例子：是最典型的aplly方法的使用。

第二個例子中本身小紅對象沒有say方法，但是我們可以通過apply方法將say方法傳遞給調(diào)用對象，也可以說綁定給指定的對象，而this也指向這個對象。

總結(jié)

所以說我們應該牢牢記住this的值取決于調(diào)用的模式。這樣才會讓我們了解初始化參數(shù)this存在的差異。

GPU云服務器云服務器 this[] this _this this變量

文章版權歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/94964.html

node那點事(一) -- Readable streams（可讀流）

摘要：流的類型中有四種基本的流類型可讀的流例如可寫的流例如可讀寫的流例如在讀寫過程中可以修改和變換數(shù)據(jù)的流例如可讀流可讀流有兩種模式流動模式可讀流自動讀取數(shù)據(jù)，通過接口的事件盡快將數(shù)據(jù)提供給應用。流的簡介流（stream）在 Node.js 中是處理流數(shù)據(jù)的抽象接口（abstract interface）。 stream 模塊提供了基礎的 API 。使用這些 API 可以很容易地來構建實...

rickchen 2019-08-22 15:58 評論0 收藏0
原生js實現(xiàn)移動端+pc端輪播插件

摘要：原生寫的輪播兼容移動端插件，支持輪播速度，輪播內(nèi)容，輪播間隔，手勢靈敏度自定義，導航圓點點擊跳轉(zhuǎn)手勢滑動。使用說明文件包含小部分語法編寫的文件，在移動端有兼容性問題，僅供于源碼參考。移動端跟端開發(fā)引用文件直接下載進行引入使用。 slide.js 原生js寫的輪播兼容 pc+移動端插件，支持輪播速度，輪播內(nèi)容，輪播間隔，手勢靈敏度自定義，導航圓點點擊跳轉(zhuǎn),手勢滑動。使用說明：sli...

leanxi 2019-08-22 16:25 評論0 收藏0
手把手教你用原生JavaScript造輪子（2）——輪播圖（更新：ES6版本）

摘要：綁定輪播事件然后是鼠標移入移出事件的綁定鼠標移入移出事件移入時停止輪播播放的定時器，移出后自動開始下一張的播放。通過上一篇文章的學習，我們基本掌握了一個輪子的封裝和開發(fā)流程。那么這次將帶大家開發(fā)一個更有難度的項目——輪播圖，希望能進一步加深大家對于面向?qū)ο蟛寮_發(fā)的理解和認識。 So, Lets begin! 目前項目使用 ES5及UMD 規(guī)范封裝，所以在前端暫時只支持標簽的引入方式...

jasperyang 2019-08-23 10:57 評論0 收藏0
基本數(shù)據(jù)結(jié)構和查找算法

摘要：本文包括簡單的數(shù)據(jù)結(jié)構和查找算法，屬于個人整理。初學編程可以用這里的東西聯(lián)系一下，看一看也挺有意思博主個人不認為中算法數(shù)據(jù)結(jié)構不重要，畢竟這是程序開發(fā)的基本功。本文包括簡單的數(shù)據(jù)結(jié)構和查找算法，屬于個人整理。初學編程可以用這里的東西聯(lián)系一下，看一看也挺有意思博主個人不認為js中算法數(shù)據(jù)結(jié)構不重要，畢竟這是程序開發(fā)的基本功。本文還會根據(jù)博主學習進展和時間安排不定期更新數(shù)據(jù)結(jié)構部分列...

姘擱『 2019-08-23 11:47 評論0 收藏0
ionic 2+ 手勢解鎖界面

摘要：手勢解鎖界面一些對安全要求比較高的少不了鎖屏頁面，而手勢解鎖對于用戶來說使用方便，對于程序員來說小有挑戰(zhàn)，怎么有棄之不用的道理。 ionic 2+ 手勢解鎖界面一些對安全要求比較高的app少不了鎖屏頁面，而手勢解鎖對于用戶來說使用方便，對于程序員來說小有挑戰(zhàn)，怎么有棄之不用的道理。效果圖效果圖處理短，方便大家閱讀showImg(https://segmentfault.co...

Hancock_Xu 2019-08-22 17:18 評論0 收藏0