js中this指向有哪些情況

本文小編為大家詳細介紹“js中this指向有哪些情況”，內(nèi)容詳細，步驟清晰，細節(jié)處理妥當，希望這篇“js中this指向有哪些情況”文章能幫助大家解決疑惑，下面跟著小編的思路慢慢深入，一起來學(xué)習新知識吧。

情況一：全局作用域或者普通函數(shù)自執(zhí)行中this指向全局對象window

console.log(this.document === document);  //true
console.log(this === window); //true

this.a = 37;  // 相當于創(chuàng)建了一個全局變量 a
console.log(window.a); //37

情況二：事件函數(shù)內(nèi)部的this指向事件源

function f1(){
  return this;
}
//在瀏覽器中：
f1() === window;   //在瀏覽器中，全局對象是window
 
//在Node中：
f1() === global;

注意：事件函數(shù)中如果包含普通函數(shù)，普通函數(shù)自執(zhí)行后，內(nèi)部this還是指向window。

情況三：對象方法調(diào)用時，this指向調(diào)用的對象

let obj = {
    attr1: 3,
    func1: function() {
        console.log(this === obj) // 輸出：true
        console.log(this.attr1) // 輸出：3
    }
}
obj.func1()

情況四：當一個函數(shù)被call或者apply調(diào)用時，this指向傳入的對象的值

let obj = {
    fn: function(){
        console.log(this);
        }
}
obj.fn(); //objobj.fn.call(12); //12

情況五：箭頭函數(shù)中自身沒有this，this指向上級的this

const xiaoming = {
    name: '小明',
    say() {
        //this指向當前對象
        console.log(this)
    },
    wait() {
        setTimeout( () => {
            //this指向當前對象
            console.log(this)
        }, 1000)
    }
}

讀到這里，這篇“js中this指向有哪些情況”文章已經(jīng)介紹完畢，想要掌握這篇文章的知識點還需要大家自己動手實踐使用過才能領(lǐng)會，如果想了解更多相關(guān)內(nèi)容的文章，歡迎關(guān)注億速云行業(yè)資訊頻道。