在JavaScript中,
- 全局上下文:在全局执行上下文中(任何函数体外部),
this 指向全局对象。在浏览器中,全局对象是window 。
console.log(this === window); // 在浏览器中,这将打印true
- 函数上下文:
- 普通函数调用:在非严格模式下,未绑定的函数中的
this 指向全局对象。在严格模式下,this 的值是undefined 。 - 方法调用:当函数作为对象的方法被调用时,
this 指向该对象。 - 构造函数:在构造函数中,
this 指向新创建的对象实例。 - 箭头函数:箭头函数没有自己的
this ,它会捕获其所在上下文的this 值。
- 普通函数调用:在非严格模式下,未绑定的函数中的
function foo() { console.log(this); } let obj = { bar: function() { console.log(this); } }; foo(); // 非严格模式下,打印全局对象;严格模式下,打印undefined obj.bar(); // 打印对象obj let arrowFunc = () => console.log(this); arrowFunc(); // 箭头函数中的this与其定义时的上下文相同,在全局中定义,因此打印全局对象
- 显式绑定:可以使用
call 、apply 或bind 方法显式地设置this 的值。
function greet() { console.log(`Hello, my name is ${this.name}`); } const person = { name: 'Alice' }; greet.call(person); // 显示 "Hello, my name is Alice"
- DOM事件处理器:当函数作为DOM事件处理程序时,
this 通常指向触发事件的元素。
button.addEventListener('click', function() { console.log(this); // this指向button元素 });