成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

詳解js和jquery里的this關(guān)鍵字

LoftySoul / 1766人閱讀

摘要：出于這個(gè)原因，該函數(shù)返回的，所以在這里指的是，所以返回的是第一個(gè)說明關(guān)鍵字通常在對(duì)象的構(gòu)造函數(shù)中使用，用來引用對(duì)象。重寫無法重寫，因?yàn)樗且粋€(gè)關(guān)鍵字。結(jié)論，表示當(dāng)前的上下文對(duì)象是一個(gè)對(duì)象，可以調(diào)用對(duì)象所擁有的屬性，方法。

在《javaScript語言精粹》這本書中，把 this 出現(xiàn)的場景分為四類，簡單的說就是：

有對(duì)象就指向調(diào)用對(duì)象
沒調(diào)用對(duì)象就指向全局對(duì)象
用new構(gòu)造就指向新對(duì)象
通過 apply 或 call 或 bind 來改變 this 的所指。

函數(shù)調(diào)用模式中，this為window；方法調(diào)用模式中，this為方法所屬的對(duì)象；構(gòu)造器調(diào)用模式中，this為創(chuàng)建的新對(duì)象。

js中的this

我們要記?。?b>this永遠(yuǎn)指向函數(shù)運(yùn)行時(shí)所在的對(duì)象！而不是函數(shù)被創(chuàng)建時(shí)所在的對(duì)象。
this對(duì)象是在運(yùn)行時(shí)基于函數(shù)的執(zhí)行環(huán)境綁定的，在全局環(huán)境中，this等于window

先來看個(gè)例子：

當(dāng)getFullname被分配到test變量時(shí)，上下文指的是全局對(duì)象（window）。這是因?yàn)?b>test是被隱式設(shè)置為全局對(duì)象的屬性。出于這個(gè)原因，該函數(shù)返回window的fullname，所以在這里 this 指的是window， 所以返回的是第一個(gè)fullname

說明

this 關(guān)鍵字通常在對(duì)象的 構(gòu)造函數(shù)中使用，用來引用對(duì)象。

關(guān)鍵字this：總是指向調(diào)用該方法的對(duì)象，如：

var iCar = new Object();
iCar.color = "red";
iCar.showColor = function(){
     alert(this.color);//輸出"red"
};

關(guān)鍵字this用在對(duì)象的showColor()方法中，在此環(huán)境，this等于iCar

使用this是因?yàn)樵趯?shí)例化對(duì)象時(shí)，總是不能確定開發(fā)者會(huì)使用什么樣的變量名。使用this，即可在任意多個(gè)地方重用同一個(gè)函數(shù)?？紤]下面的例子：

function showColor(){
     alert(this.color);
}
var oCar1 = new Object;
oCar1.color = "red";
oCar1.showColor = showColor;

var oCar2 = new Object;
oCar2.color = "blue";
oCar2.showcolor = showcolor;

oCar1.showColor();//輸出"red"
oCar2.showColor();//輸出"blue"

這段代碼中，首先用this定義函數(shù)showColor()，然后創(chuàng)建兩個(gè)對(duì)象oCar1和oCar2，一個(gè)對(duì)象屬性被設(shè)置為"red",另一個(gè)為blue；兩個(gè)對(duì)象都被賦予了屬性showColor，指向原始的showColor()函數(shù)，調(diào)用每個(gè)showColor的方法，oCar1輸出red，oCar2輸出blue。

引用對(duì)象屬性時(shí)，必須使用this關(guān)鍵字。

所有基于全局作用域的變量其實(shí)都是window對(duì)象的屬性（property）。這意味著即使是在全局上下文中，this變量也能指向一個(gè)對(duì)象。

對(duì)于 JScript 的客戶版本，如果在其他所有對(duì)象的上下文之外使用 this，則它指的是 window 對(duì)象。
例如：
作為構(gòu)造函數(shù)調(diào)用

所謂構(gòu)造函數(shù)，就是通過這個(gè)函數(shù)生成一個(gè)新對(duì)象（object）。這時(shí)，this就指這個(gè)新對(duì)象。
全局環(huán)境中的this

在看下面一個(gè)this出現(xiàn)在全局環(huán)境中的例子：

函數(shù)getName()所處的對(duì)象是window對(duì)象，因此this也一定在window對(duì)象中。此時(shí)的this指向window對(duì)象，所以getName()返回的this.name其實(shí)是window.name，因此alert出全局。

結(jié)論：無論this身處何處，一定要找到函數(shù)運(yùn)行時(shí)（或者說在何處被調(diào)用 了）的位置。

通過不同的調(diào)用語法，改變相同函數(shù)內(nèi)部this的值：
局部環(huán)境中的this

看下面一個(gè)this出現(xiàn)在局部環(huán)境中的例子

其中this身處的函數(shù)getName不是在全局環(huán)境中，而是處在jubu環(huán)境中。無論this身處何處，一定要找到函數(shù)運(yùn)行時(shí)的位置。此時(shí)函數(shù)getName運(yùn)行時(shí)的位置：

alert(jubu.getName());

顯然，函數(shù)getName所在的對(duì)象是jubu，因此this的安身之處定然在jubu，即指向jubu對(duì)象，則getName返回的this.name其實(shí)是jubu.name，因此alert出來的是“局部”！

作用域鏈中的this

因?yàn)?b>scoping函數(shù)屬于window對(duì)象，自然作用域鏈中的函數(shù)也屬于window對(duì)象。

對(duì)象中的this

可以在對(duì)象的任何方法中使用this來訪問該對(duì)象的屬性。這與用new得到的實(shí)例是不一樣的。

var obj = {
    foo: "test",
    bar: function () {
        console.log(this.foo);
    }
};

obj.bar(); // "test"
重寫this

無法重寫this，因?yàn)樗且粋€(gè)關(guān)鍵字。

function test () {
    var this = {};  // Uncaught SyntaxError: Unexpected token this 
}
apply 和 call 調(diào)用以及 bind 綁定

apply 和 call 調(diào)用以及 bind 綁定都是指向綁定的對(duì)象，
jquery中的this

$()生成的是什么呢？實(shí)際上$()=jquery()，那么也就是說返回的是一個(gè)jquery的對(duì)象。
$(this)是jquery對(duì)象，能調(diào)用jquery的方法，例如click(), keyup()。

 $(function () {
   $("button").click(function () {
       alert(this);//this 表示原生的DOM
       //$(this)表示當(dāng)前對(duì)象，這里指的是button
   }) 
});

在許多情況下JQuery的this都指向HTML元素節(jié)點(diǎn)。

結(jié)論：
this，表示當(dāng)前的上下文對(duì)象是一個(gè)html DOM對(duì)象，可以調(diào)用html對(duì)象所擁有的屬性，方法。
$(this),代表的上下文對(duì)象是一個(gè)jquery的上下文對(duì)象，可以調(diào)用jquery的方法和屬性值。

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

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/87624.html

相關(guān)文章

  • 【連載】前端個(gè)人文章整理-從基礎(chǔ)到入門

    摘要：個(gè)人前端文章整理從最開始萌生寫文章的想法，到著手開始寫，再到現(xiàn)在已經(jīng)一年的時(shí)間了，由于工作比較忙，更新緩慢，后面還是會(huì)繼更新，現(xiàn)將已經(jīng)寫好的文章整理一個(gè)目錄，方便更多的小伙伴去學(xué)習(xí)。 showImg(https://segmentfault.com/img/remote/1460000017490740?w=1920&h=1080); 個(gè)人前端文章整理 從最開始萌生寫文章的想法，到著手...

    madthumb 評(píng)論0 收藏0

  • Ajax詳解

    摘要：當(dāng)請(qǐng)求完成后注冊(cè)一個(gè)回調(diào)函數(shù)。該請(qǐng)求是否觸發(fā)全局處理事件如等，請(qǐng)求發(fā)送前的回調(diào)函數(shù)，用來修改請(qǐng)求發(fā)送前，此功能可用來設(shè)置自定義頭信息，在函數(shù)中返回將取消這個(gè)請(qǐng)求。例如，為請(qǐng)求指定一個(gè)回調(diào)函數(shù)名。即改變回調(diào)函數(shù)的，默認(rèn)就是傳入的整個(gè)對(duì)象。 Ajax Ajax 全稱是 asynchronous javascript and xml，并不是新的編程語言，可以說是已有技術(shù)的組合，主要用來實(shí)現(xiàn)客...

    jokester 評(píng)論0 收藏0

  • 詳解1000+項(xiàng)目數(shù)據(jù)分析出來的10大JavaScript錯(cuò)誤

    摘要：當(dāng)未捕獲的錯(cuò)誤通過處理程序引發(fā)的錯(cuò)誤，而不是捕獲在中被瀏覽器的跨域策略限制時(shí)，會(huì)產(chǎn)生這類的腳本錯(cuò)誤。例如，如果您將您的代碼托管在上，則任何未被捕獲的錯(cuò)誤將被報(bào)告為腳本錯(cuò)誤而不是包含有用的堆棧信息。 譯者按： null/undefined引發(fā)的錯(cuò)誤在10大錯(cuò)誤中比例很高。而它們很可能導(dǎo)致嚴(yán)重問題，所以要重視起來。 原文: Top 10 JavaScript errors from 10...

    jubincn 評(píng)論0 收藏0

  • 前端基礎(chǔ)進(jìn)階（十五）：詳解 ES6 Modules

    摘要：下載地址安裝一個(gè)好用的命令行工具在環(huán)境下，系統(tǒng)默認(rèn)的非常難用，所以我個(gè)人比較推薦大家使用或者。下載地址安裝在命令行工具中使用查看版本的方式確保與都安裝好之后，我們就可以安裝了。前端基礎(chǔ)進(jìn)階系列目錄 showImg(https://segmentfault.com/img/remote/1460000009654403?w=1240&h=272); 對(duì)于新人朋友來說，想要自己去搞定一個(gè)E...

    Lowky 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

LoftySoul

男|高級(jí)講師

TA的文章

閱讀更多
最新活動(dòng)
閱讀需要支付1元查看
<