call/apply/bind改变this指向详解

本文深入解析了 JavaScript 中 call、apply 和 bind 三大函数方法在改变 this 指向上的核心机制与关键差异：call 和 apply 均立即执行，区别仅在于参数传递形式（逐个传入 vs 数组传入），而 bind 则返回一个 this 与部分参数已被永久固化的新函数，具备不可覆盖的“硬绑定”特性；文章不仅通过典型 DOM 场景和数组参数案例说明选型逻辑，还揭示了 bind 在柯里化中的实用价值，并重点警示了箭头函数因无独立 this 而完全无视 call/apply/bind 的本质陷阱，以及重复 bind 导致 this 锁死等高频调试痛点——帮你避开误区，真正掌握 this 控制权。

call/apply/bind 的核心区别在哪

三者都能手动指定函数执行时的 this，但调用方式和返回结果不同：
— call 立即执行，参数逐个传入；
— apply 立即执行，第二个参数必须是数组（或类数组）；
— bind 不执行，返回一个新函数，this 和部分参数被预先绑定。

什么时候该用 call 而不是 apply

当你已有散列的参数变量，且数量固定时，call 更直观。比如从 DOM 元素取值后直接传给某个方法：

function logInfo(name, age, city) {
  console.log(this.role + ': ' + name + ', ' + age + ', ' + city);
}
const obj = { role: 'admin' };
logInfo.call(obj, 'Alice', 28, 'Beijing'); // admin: Alice, 28, Beijing

如果参数存在数组里（比如 args = ['Bob', 31, 'Shanghai']），硬用 call 就得写 logInfo.call(obj, args[0], args[1], args[2]) —— 容易出错且不灵活，这时该用 apply。

bind 绑定后还能再改 this 吗

不能。一旦用 bind 绑定了 this，后续无论用 call、apply 还是普通调用，都无法覆盖原始绑定。这是硬绑定（hard binding）机制：

function say() { return this.name; }
const bound = say.bind({ name: 'John' });
bound.call({ name: 'Jane' }); // 仍返回 'John'
bound.apply({ name: 'Tom' }); // 仍返回 'John'

常见坑：在事件监听或 setTimeout 中误用 bind 多次，导致 this 锁死，调试时发现对象属性始终读不到最新值。

箭头函数里能用 call/apply/bind 改 this 吗

不能。箭头函数没有自己的 this，它会沿作用域链向上找外层普通函数的 this，而这个查找过程在定义时就确定了，与调用方式无关：

const obj = { name: 'Alice', fn: () => this.name };
obj.fn.call({ name: 'Bob' }); // undefined（因为外层 this 是全局或模块级）

所以别对箭头函数尝试 call 或 bind —— 它们不会报错，但也不会生效，只会让你花时间怀疑人生。

真正容易被忽略的是 bind 返回函数的柯里化行为：它不仅能绑定 this，还能预设前几个参数，这个特性在封装工具函数（如防抖、API 请求包装）时特别实用，但初学者常只注意到 this 部分而漏掉参数固化能力。

好了，本文到此结束，带大家了解了《call/apply/bind改变this指向详解》，希望本文对你有所帮助！关注golang学习网公众号，给大家分享更多文章知识！