前端进阶之旅前端进阶之旅
  • 基础篇HTML/CSS/JS 打底
  • 进阶篇原理与工程化
  • 高频篇面试最常问的那批
  • 精选篇按模块收敛的总结
  • 手写篇常考代码手写实现
  • 面经篇真实面试问题复盘
  • AI 篇NEWAI 时代的前端考点
  • 历年面经NEW按年份追踪真实考点
  • 每日一题每天一道,攒手感
  • 专项自测100 题快速查漏
  • 小程序题库小程序专项刷题
  • 算法题库NEW在线编码即时判题
  • 知识卡片NEW碎片时间过考点
  • 面试题大全常见问题解析
  • AI 答疑NEW随时提问,即时解析
  • AI 模拟面试NEW模拟真实面试 + 报告
  • AI 定制路线NEW按你的简历现排
  • AI 知识地图NEW串起全站知识点
  • 原理篇React / Vue 源码拆解
  • HTTP从报文一路讲到 HTTPS
  • 浏览器渲染、事件循环、进程
  • 计算机基础Linux、网络、操作系统
  • 设计模式23 种模式怎么用
  • Node学习指南从环境搭建到服务端
  • NPM工作流script、依赖与发布
  • Docker容器化部署上手
  • Canvas图形与动画实战
  • 前端系统进阶学习大型项目工程化
  • 前端综合文章长期沉淀的实践文
  • 思维导图知识点全景图
  • 学习路线按图索骥不跑偏
  • AI 热点NEWAI 每日动态
  • 公众号动态公众号历史文章
  • 博客动态站长的技术博客
  • 开发者导航常用工具与文档站
  • 基础篇HTML/CSS/JS 打底
  • 进阶篇原理与工程化
  • 高频篇面试最常问的那批
  • 精选篇按模块收敛的总结
  • 手写篇常考代码手写实现
  • 面经篇真实面试问题复盘
  • AI 篇NEWAI 时代的前端考点
  • 历年面经NEW按年份追踪真实考点
  • 每日一题每天一道,攒手感
  • 专项自测100 题快速查漏
  • 小程序题库小程序专项刷题
  • 算法题库NEW在线编码即时判题
  • 知识卡片NEW碎片时间过考点
  • 面试题大全常见问题解析
  • AI 答疑NEW随时提问,即时解析
  • AI 模拟面试NEW模拟真实面试 + 报告
  • AI 定制路线NEW按你的简历现排
  • AI 知识地图NEW串起全站知识点
  • 原理篇React / Vue 源码拆解
  • HTTP从报文一路讲到 HTTPS
  • 浏览器渲染、事件循环、进程
  • 计算机基础Linux、网络、操作系统
  • 设计模式23 种模式怎么用
  • Node学习指南从环境搭建到服务端
  • NPM工作流script、依赖与发布
  • Docker容器化部署上手
  • Canvas图形与动画实战
  • 前端系统进阶学习大型项目工程化
  • 前端综合文章长期沉淀的实践文
  • 思维导图知识点全景图
  • 学习路线按图索骥不跑偏
  • AI 热点NEWAI 每日动态
  • 公众号动态公众号历史文章
  • 博客动态站长的技术博客
  • 开发者导航常用工具与文档站
首页程序员面试题库this 绑定规则与优先级
JSJavaScript函数与作用域

JavaScript 中 this 的绑定规则有哪些?优先级如何?

JavaScript 中 this 在函数调用时确定,取决于调用方式。按优先级从低到高依次为:默认绑定、隐式绑定、显式绑定、new 绑定,满足条件的规则优先。

前端进阶之旅 · 一题精讲更新于 2026.09.05
JavaScript#函数与作用域
先看核心答案
理解线索

this 是调用时动态决定的形参

  1. 调用点函数被调用的代码位置与方式
  2. 隐藏参数this 如同传入的实参,由调用决定
  3. 优先级先判断规则,再按层级取舍

判断顺序:先看是否用 new,再看 call/bind/apply,再看是否作为方法调用,最后才是默认。

核心回答

先记住这个答案

规则:默认绑定(独立调用指向全局或 undefined);隐式绑定(obj.fn() 指向 obj);显式绑定(call/apply/bind 指定 this);new 绑定(构造调用新建对象)。优先级:new 最高,显式绑定其次,隐式绑定再其次,默认最低。若同时出现,先按规则筛选,再按优先级裁决。

  • 默认绑定最低,this 为全局或 undefined
  • 隐式绑定看调用对象,不等于定义处
  • new 优先级最高,且显式高于隐式

四条规则的触发条件与优先级依据

默认绑定指函数无任何限定直接调用,如 fn()。非严格模式 this 指向 globalThis(浏览器为 window);严格模式为 undefined。这是兜底规则,优先级最低。

隐式绑定要求调用形式为 obj.method(),此时函数体 this 指向 obj。但实际绑定的对象是调用发生时被obj引用的对象,与函数声明所在对象无关。若只取方法再单独调用,则丢失绑定。

显式绑定通过 call(that, ...args) 和 apply(that, argsArray) 强制指定 this,而 bind 创建新函数,其 this 永久固定。显式绑定优先级高于隐式,原因是调用点明确传入 this。

new 绑定发生在用 new 调用函数时,JavaScript 会新建对象并让函数内 this 指向该对象,即使函数体有 call 改写也无济于事——new 是语言层面的最高干预。

对象方法名作为回调时的 this 丢失

假设一个 counter 对象,方法 increment 内部依赖 this.count。setTimeout(counter.increment, 1000) 会把函数引用传出,调用点是定时器,无对象前缀,触发默认绑定。严格模式下 this 为 undefined,触发 TypeError。

解决需显式绑定:setTimeout(counter.increment.bind(counter), 1000)。因为 bind 生成的函数无论后续怎么传参或作为独立函数调用,其 this 永远是 counter,保证回调执行正确。

另一个场景是数组遍历:[1,2].forEach(counter.increment) 内部实现会把回调作为独立的函数调用,同样丢失。应当写成 forEach(counter.increment, counter) 或使用箭头函数保留词法作用域,但箭头函数本主题不展开。

规则在严格模式与绑定函数中的边界

默认绑定受严格模式影响:若函数体处于 "use strict",独立调用 this 为 undefined,而不是全局对象。这与调用处是否严格无关,而是看函数定义时的模式。

bind 创建的绑定函数不能被 call 或 apply 再次更改 this,即使强行调用也保持初始值。但注意 bind 本身不会阻止 new 调用,以 new 调用绑定函数时,new 绑定会覆盖原 this,这是极少数例外。

隐式绑定在严格模式下若访问 obj.method 并直接调用,仍遵循默认绑定规则,但若方法本身是访问器属性,则与原型链相关,需单独分析。

回答前,多想一步

容易答错的地方

define-time 绑定误解
常见认为 this 在函数定义时绑定到所在对象。实际上 this 是调用期决定,同一函数赋给不同对象,调用结果不同。例如 const a = obj.method; a() 与非严格模式会指向全局,而非 obj。
bind 与 call 同时用混淆
误以为 fn.bind(ctx).call(other) 中 other 会覆盖 ctx。事实是 bind 返回新函数,其 this 永久固定为 ctx,后续 call 无效,除非用 new 调用才可能改变。
试着用自己的话回答

面试官还会怎么问?

new 绑定和显式绑定同时存在时,谁优先?

new 优先。例如 const obj = new (fn.bind(that))(),生成的新对象覆盖 bind 提供的 that。new 构造时函数内部 this 指向新对象,bind 只影响普通调用。

隐式绑定丢失后如何恢复?

使用 Function.prototype.bind 将方法绑定到对象上形成新函数,或利用箭头函数捕获外层 this(但不在本题)。另一种方式是在调用处保留对象引用:setTimeout(() => obj.method()),该箭头函数内部 obj.method() 为隐式绑定。

严格模式对默认绑定和隐式绑定是否有影响?

严格模式只改变默认绑定的值:全局变为 undefined。隐式绑定和显式绑定、new 绑定行为不变,仅函数体内的 this 值按规则设置,与是否严格无关。

从一道题,走向一组知识

把知识连起来

函数与作用域

Function.prototype.bind 与 call/apply 的区别是什么?bind 返回的新函数有哪些特性?

详细区分 bind/call/apply,加深对显式绑定特性的理解。

函数与作用域

使用 new 调用函数时,函数内部会发生哪些步骤?this 如何绑定?

深入 new 调用内部步骤,理解为何 new 绑定优先级最高。

放回知识体系中复习JavaScript 进阶知识

参考资料

  • this

示例用于理解所注明的运行环境与边界;延伸学习可结合原文中的更多案例。

本题目录
  1. 先记住这个答案
  2. 四条规则的触发条件与优先级依据
  3. 对象方法名作为回调时的 this 丢失
  4. 规则在严格模式与绑定函数中的边界
  5. 容易答错的地方
  6. 面试官还会怎么问
  7. 把知识连起来
读懂,再试着讲出来

先看核心答案,再读代码。最后展开追问,检查自己有没有遗漏边界。

试着回答追问
浏览全部面试题理解原理,也关注真实的使用场景。回到顶部 ↑