javascript中的‘this’是什么_它的指向如何确定【教程】_网络技术

发布时间 - 2026-01-23 00:00:00 点击率：次

普通函数调用时，this在非严格模式下指向window或globalThis，严格模式下为undefined；对象方法赋值后调用会丢失this；箭头函数继承外层this；构造函数需用new调用，否则this指向错误。

JavaScript 中的 this 不是定义时绑定的，而是调用时决定的——它永远指向函数执行时的“当前对象”，但这个“当前对象”并不总是你直觉认为的那个。

在非严格模式下，全局环境或独立调用函数（如 foo()）时，this 指向 window（浏览器）或 globalThis（Node.js）；严格模式下则为 undefined。

常见错误现象：console.log(this) 在顶层函数里输出 Window，但你本意是想访问某个实例属性，结果报 Cannot read property 'x' of undefined
使用场景：工具函数、一次性逻辑封装，但若内部依赖 this，极易出错
实操建议：避免在普通函数中依赖 this；如需绑定上下文，显式传参或用箭头函数替代

当把对象方法赋值给变量或作为回调传入（如 setTimeout(obj.method, 100)），this 会丢失原始绑定，退回到默认规则（即上一条）。

典型表现：obj.method() 正常，但 const fn = obj.method; fn() 报错或访问不到预期属性
参数差异：bind、call、apply 可强制指定 this，但 bind 返回新函数，call/apply 立即执行
实操建议：用 obj.method.bind(obj)，或改写为箭头函数（仅适用于不需动态 this 的场景），更推荐在类中用 class fields + arrow function 写法（如 handler = () => { ... }）

箭头函数不创建自己的 this，而是沿作用域链向上查找，继承外层普通函数或全局作用域的 this 值。

使用场景：事件回调、定时器、Promise 链内需要保持上下文一致时（如 React 组件中处理点击）
容易踩的坑：Object.prototype 上定义的箭头函数无效（语法不允许）；构造函数不能是箭头函数（无 new.target，也无法用 new 调用）
性能影响：无额外 this 绑定开销，但过度嵌套可能让 this 来源变得隐晦难追踪