国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

JavaScript：this的指向

sPeng / 1050人閱讀

摘要：內聯(lián)函數(shù)中的指向事件發(fā)生的元素在彈出框中顯示事件處理函數(shù)中的當一個函數(shù)被用作事件處理函數(shù)時，它的指向觸發(fā)事件的元素

理解JS中this的指向

每個函數(shù)都有它自己的this值，在絕大多數(shù)情況下，this指向調用了函數(shù)的那個對象。
為了自己更加清楚地認識this的指向，我總結出了以下幾種情況：

全局環(huán)境中的this

無論是否處于嚴格模式，在全局環(huán)境中（或者理解為在任何函數(shù)體的外部）this 都指代全局對象:

console.log(this); //全局對象

var num = 100;
console.log(this.num); // 100
函數(shù)內部中的this

在全局環(huán)境中調用函數(shù)，函數(shù)內部的this指向有以下兩種情況：

在非嚴格模式下，this的值等于全局對象：

function temp(){
    return this;
};
console.log(temp()); //全局對象

在嚴格模式下，由于this并沒有被提前定義，所以，this的值等于undefined：

function temp(){
    "use strict";
    return this;
};
console.log(temp()); //undefined

用apply和call方法可以指定this的值：

var obj = {
    name: "Tom"
};

function temp(){
    "use strict";
    return this;
};

console.log(temp.call(obj)); //{name: "Tom"}

補充知識點：在嚴格模式下，通過this傳遞給一個函數(shù)的值不會被強制轉換為一個對象:

function temp(){
    "use strict"; 
    return this
}
console.log(temp.call(true)); // true
console.log(temp.call(56)); // 56
console.log(temp.apply(null)); //
ES6箭頭函數(shù)中的this

箭頭函數(shù)不會創(chuàng)建自己的this,它只會從自己所處的作用域鏈的上一層繼承this。

例1：箭頭函數(shù)沒有自己的this指針，通過call或apply方法調用一個箭頭函數(shù)時，為this綁定特定的值是無效的：

var name = "window";

var obj = {
    name: "Tom"
};

var temp = () => {
    return this.name;
};

console.log(temp.call(obj)); //window

箭頭函數(shù)是在全局環(huán)境中調用的，它上一層的this指向全局對象，所以，它的this也指向全局對象。

例2：在函數(shù)內部創(chuàng)建的箭頭函數(shù)，其this指向等同于包含函數(shù)的this指向：

name = "window";

let obj = {
    name: "Tom",
    test: function(){
        let temp = (()=>{
          return this.name;
        });
        return temp;
    }
};

console.log(obj.test()()); //Tom

包含函數(shù)作為對象里面的方法被調用時，它的this指向調用它的對象obj，所以，箭頭函數(shù)的this也指向obj。

name = "window";

let obj = {
    name: "Tom",
    test: function(){
        let temp = (()=>{
          return this.name;
        });
        return temp;
    }
};

let a = obj.test;
console.log(a()()); //window

包含函數(shù)被賦值給一個全局變量，之后再在全局環(huán)境中調用，顯然，此時它的this指向調用它的全局對象，所以，箭頭函數(shù)的this也指向全局對象。

例3：明白了箭頭函數(shù)的this指向原理，在回調函數(shù)中就不用寫這樣的代碼了：var that = this，這里以setTimeout的回調函數(shù)為例：

不用箭頭函數(shù):

var name = "outer";

var obj = {
    name: "Tom"
};

function temp(){
    let that = this;
    setTimeout(function(){
        console.log(that.name);
    },1000);
}

temp.call(obj); //Tom

使用箭頭函數(shù):

var name = "outer";

var obj = {
    name: "Tom"
};

function temp(){
    setTimeout(() => {
        console.log(this.name);
    },1000);
}

temp.call(obj); // Tom
作為對象的方法中的this

對象中函數(shù)的this指向調用函數(shù)的那個對象， 并且是離得最近的那個對象：

name = "window";

let obj1 = {
    name: "1",
    test: function(){
        return this.name;
    },
    other: {
        name: "2"
    }
};

obj1.other.test = obj1.test;

console.log(obj1.test()); // 1
console.log(obj1.other.test()); //2

let aa = obj1.test;
console.log(aa()); //全局對象
構造函數(shù)中的this

構造函數(shù)中的this指向創(chuàng)建的新對象:

function Person(name){
    this.name = name;
};
let child = new Person("Tom");

補充知識點：new的過程到底發(fā)生了什么：

創(chuàng)建一個新的對象child;

將構造函數(shù)的作用域賦給對象，即構造函數(shù)中的this指向child;

執(zhí)行構造函數(shù)中的操作；

返回對象child({name: "Tom"})。

內聯(lián)函數(shù)中的this

指向事件發(fā)生的DOM元素:

    
     // 在彈出框中顯示：btn
Dom事件處理函數(shù)中的this

當一個函數(shù)被用作事件處理函數(shù)時，它的this指向觸發(fā)事件的元素:

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

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/99563.html

相關文章

  • javascript技術難點（三）之this、new、apply和call詳解

    摘要：第四點也要著重講下，記住構造函數(shù)被操作，要讓正常作用最好不能在構造函數(shù)里 4) this、new、call和apply的相關問題 講解this指針的原理是個很復雜的問題，如果我們從javascript里this的實現(xiàn)機制來說明this，很多朋友可能會越來越糊涂，因此本篇打算換一個思路從應用的角度來講解this指針，從這個角度理解this指針更加有現(xiàn)實意義。 下面我們看看在ja...

    ghnor 評論0 收藏0

  • 我對JavaScript中this的一些理解

    摘要：匿名函數(shù)的執(zhí)行環(huán)境具有全局性，因此它的對象通常指向。如果對此有疑惑，可以看知乎上的答案知乎匿名函數(shù)的指向為什么是作為對象方法的調用，指向該對象當函數(shù)作為某個對象的方法調用時，就指這個函數(shù)所在的對象。 因為日常工作中經(jīng)常使用到this，而且在JavaScript中this的指向問題也很容易讓人混淆一部分知識。 這段時間翻閱了一些書籍也查閱了網(wǎng)上一些資料然后結合自己的經(jīng)驗，為了能讓自...

    focusj 評論0 收藏0

  • 學習JavaScript之this,call,apply

    摘要：在全局對象中調用，自然讀取的是全局對象的值構造器調用說明作為構造器調用時，指向返回的這個對象。最直觀的表現(xiàn)就是，去看一些優(yōu)秀框架的源代碼時，不再是被繞的暈乎乎的。 學習起因： 在之前的JavaScript學習中，this,call,apply總是讓我感到迷惑，但是他們的運用又非常的廣泛。遂專門花了一天，來弄懂JavaScript的this,call,apply。中途參考的書籍也很多，以...

    wenhai.he 評論0 收藏0

  • JavaScript 中 this 的指向問題

    摘要：首發(fā)個人博客中的，大家都用過。箭頭函數(shù)，詞法作用域中的簡單的說，箭頭函數(shù)中的，會綁定到函數(shù)外也就是上一層作用域中的，函數(shù)外的指向哪，箭頭函數(shù)中的就指向哪。 首發(fā)個人博客 JavaScript 中的 this ，大家都用過。但是它到底指向哪里呢？今天在閱讀 《你不知道的JavaScript (上卷)》再結合自己平時看的博客，對它又有了新的認識，在此來做個小結，再碰到 this ,就再也不...

    DTeam 評論0 收藏0

  • 輕松搞定javascript中this的指向

    摘要：調用在中，通過的形式調用一個構造函數(shù)，會創(chuàng)建這個構造函數(shù)實例，而這個實例的指向創(chuàng)建的這個實例。如下例所示，在構造函數(shù)內部使用并沒有改變全局變量的值。顯然，箭頭函數(shù)是不能用來做構造函數(shù)。 　　關于javascript中this指向的問題，現(xiàn)總結如下，如有不正確，歡迎指正。 　　javascript中，this的指向并不是在函數(shù)定義的時候確定的，而是在其被調用的時候確定的。也就是說，函數(shù)的...

    shinezejian 評論0 收藏0

  • 理解 JavaScript this

    摘要：回調函數(shù)在回調函數(shù)中的指向也會發(fā)生變化。在閉包回調函數(shù)賦值等場景下我們都可以利用來改變的指向，以達到我們的預期。文章參考系列文章理解閉包理解執(zhí)行棧理解作用域理解數(shù)據(jù)類型與變量原文發(fā)布在我的公眾號，點擊查看。 這是本系列的第 5 篇文章。 還記得上一篇文章中的閉包嗎？點擊查看文章 理解 JavaScript 閉包 。 在聊 this 之前，先來復習一下閉包： var name = Nei...

    zombieda 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<