this的指向由函数调用方式决定：1. 全局环境中指向全局对象（非严格模式）或undefined（严格模式函数中）；2. 作为对象方法调用时指向该对象；3. 构造函数中指向新创建的实例；4. call、apply、bind可显式绑定this；5. 箭头函数无自身this，继承外层作用域；6. 事件处理函数中通常指向触发事件的DOM元素。
在JavaScript中，this关键字的指向是许多开发者容易混淆的核心概念。它不是在函数定义时决定的，而是在函数运行时根据调用上下文动态确定的。理解this的指向，关键在于分析函数是如何被调用的。
1. 全局环境中的this
在全局执行环境中（浏览器中），无论是否在严格模式下，this都指向全局对象。
• 非严格模式：this指向window（浏览器）或global（Node.js）
• 严格模式：”use strict”下，在全局函数中this仍为undefined，但全局环境中this仍是全局对象
例如：
console.log(this === window); // true（浏览器中）function fn() { console.log(this === window);}fn(); // true（非严格模式）
2. 函数作为对象方法调用
当函数作为某个对象的方法被调用时，this指向该对象。
立即学习“Java免费学习笔记（深入）”；
• this绑定到调用该方法的对象
• 即使方法是在外部定义，只要通过对象.方法()调用，this仍指向该对象
示例：
const obj = { name: 'Alice', greet() { console.log(this.name); }};obj.greet(); // 输出 'Alice'，this指向obj
3. 构造函数中的this
使用new操作符调用函数时，this指向新创建的实例对象。
• 构造函数内部的this代表即将生成的实例
• 若构造函数返回一个非原始类型对象，则this指向该返回对象
例子：
function Person(name) { this.name = name;}const p = new Person('Bob');console.log(p.name); // 'Bob'，this指向新创建的p实例
4. 显式绑定：call、apply、bind
可以通过call、apply或bind方法显式指定this的值。
• call和apply立即执行函数，并将第一个参数作为this的值
• bind返回一个新函数，其this被永久绑定到指定对象
代码演示：
function showInfo() { console.log(this.name);}const user = { name: 'Charlie' };showInfo.call(user); // 'Charlie'const boundFn = showInfo.bind(user);boundFn(); // 'Charlie'
5. 箭头函数中的this
箭头函数没有自己的this，它的this继承自外层作用域（词法作用域）。
• 无法通过call、apply、bind改变箭头函数的this
• 常用于回调函数中保持this指向外层对象
示例：
const obj = { name: 'Diana', delayGreet: function() { setTimeout(() => { console.log(this.name); // 'Diana'，this来自delayGreet的this }, 1000); }};obj.delayGreet();
6. 事件处理中的this
DOM事件处理函数中，this通常指向触发事件的DOM元素。
• addEventListener绑定的函数，this为事件目标元素
• 若使用箭头函数，则this取决于外层作用域
比如：
button.addEventListener('click', function() { console.log(this === button); // true});
基本上就这些。掌握this的关键是看函数如何被调用，而不是在哪里定义。不同调用方式决定了this的不同指向，理解这一点就能应对大多数场景。不复杂但容易忽略细节，多练习常见模式会更熟练。
以上就是JS中this关键字的指向问题全解析_javascript核心的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1534028.html
微信扫一扫 
支付宝扫一扫 
