进阶-this

在JavaScript中，this是一个特殊的关键字，表示当前执行代码的上下文对象。它的值根据代码的执行环境不同而变化。以下是对this的详细介绍：

1. 全局上下文中的this： 在全局作用域中，this指向全局对象，通常是window对象（在浏览器环境中）。在严格模式下，全局作用域中的this将是undefined。

?

1	console.log(this); // 在浏览器环境中，输出全局对象 window

　　

2. 函数中的this： 在函数内部，this的值取决于函数是如何调用的。

• 作为函数调用时： 如果函数作为普通函数调用（非方法），this指向全局对象（浏览器环境下为window）。

?

1 2 3 4 5

function myFunction() {   console.log(this); }   myFunction(); // 在浏览器环境中，输出全局对象 window

　　

• 作为对象的方法调用时： 如果函数作为对象的方法调用，this指向调用该方法的对象。

?

1 2 3 4 5 6 7 8

let obj = {   name: "John",   sayHello: function() {     console.log("Hello, " + this.name);   } };   obj.sayHello(); // 输出 "Hello, John"

　　

• 使用call或apply方法调用时： 可以使用call或apply方法显式地指定函数的执行上下文（this的值）。

?

1 2 3 4 5 6 7

function greet() {   console.log("Hello, " + this.name); }   let person = { name: "John" };   greet.call(person); // 输出 "Hello, John"

　　

3. 箭头函数中的this： 箭头函数没有自己的this绑定，它会继承上层作用域的this值。

?

1 2 3 4 5 6 7 8 9 10 11 12

let obj = {   name: "John",   sayHello: function() {     let greet = () => {       console.log("Hello, " + this.name);     };       greet();   } };   obj.sayHello(); // 输出 "Hello, John"