JavaScript中的this關(guān)鍵字一直是一個(gè)比較困惑人的概念，因?yàn)樗闹赶虿⒉皇枪潭ǖ模歉鶕?jù)當(dāng)前代碼執(zhí)行的環(huán)境以及被調(diào)用的方式而定。在JavaScript中，this指向的是當(dāng)前函數(shù)的執(zhí)行環(huán)境，它會(huì)在函數(shù)被調(diào)用時(shí)被自動(dòng)賦值。

以上述代碼為例，person.sayHi()中的this指向的是調(diào)用該函數(shù)的對(duì)象person。因?yàn)樵谡{(diào)用該函數(shù)時(shí)，函數(shù)的上下文環(huán)境被設(shè)置為person對(duì)象。因此，this.name和this.age分別指向的是person對(duì)象的name和age屬性。

const person = {
name: '張三',
age: 20,
sayHi() {
console.log(我叫${this.name}，今年${this.age}歲);
},
};
person.sayHi();

然而，當(dāng)函數(shù)的上下文環(huán)境改變時(shí)，this指向也會(huì)發(fā)生變化。比如調(diào)用函數(shù)的方式有以下三種：

• 作為普通函數(shù)調(diào)用
• 作為對(duì)象的方法調(diào)用
• 使用call()、apply()、bind()方法指定this指向

當(dāng)函數(shù)作為普通函數(shù)調(diào)用時(shí)，this指向的是全局對(duì)象window。

function sayHi() {
console.log(我叫${this.name}，今年${this.age}歲);
}
const person = {
name: '張三',
age: 20,
sayHi: sayHi,
};
sayHi(); // 輸出 "我叫undefined，今年undefined歲"

當(dāng)函數(shù)作為對(duì)象的方法調(diào)用時(shí)，this指向的是該對(duì)象。

function sayHi() {
console.log(我叫${this.name}，今年${this.age}歲);
}
const person = {
name: '張三',
age: 20,
sayHi: sayHi,
};
person.sayHi(); // 輸出 "我叫張三，今年20歲"

當(dāng)使用call()、apply()、bind()方法指定this指向時(shí)，this指向的是第一個(gè)參數(shù)傳入的對(duì)象。

function sayHi() {
console.log(我叫${this.name}，今年${this.age}歲);
}
const person1 = {
name: '張三',
age: 20,
};
const person2 = {
name: '李四',
age: 30,
};
sayHi.call(person1); // 輸出 "我叫張三，今年20歲"
sayHi.apply(person2); // 輸出 "我叫李四，今年30歲"
const sayHi1 = sayHi.bind(person1);
const sayHi2 = sayHi.bind(person2);
sayHi1(); // 輸出 "我叫張三，今年20歲"
sayHi2(); // 輸出 "我叫李四，今年30歲"

在JavaScript中，this的指向問題是非常重要的。如果我們沒有清晰地理解this指向的機(jī)制，那么就很容易產(chǎn)生代碼出錯(cuò)的情況。因此，我們需要在編寫JavaScript代碼時(shí)，對(duì)this的指向問題進(jìn)行非常仔細(xì)的考慮，以保證代碼的正確性和健壯性。