深入理解call、applay和bind

最新推荐文章于 2025-07-01 10:42:28 发布

神三元

最新推荐文章于 2025-07-01 10:42:28 发布

阅读量3.6k

点赞数

CC 4.0 BY-SA版权

分类专栏：前端开发

本文链接：https://blog.youkuaiyun.com/weixin_42098339/article/details/89741562

前端开发专栏收录该内容

33 篇文章

订阅专栏

本文详细探讨了JavaScript中call、apply和bind方法的原理和使用场景。它们都用于改变函数执行时的上下文(this)。call直接传递参数，apply以数组形式传递参数，bind则返回一个新函数保留指定的this并可延迟执行。在非严格模式下，未指定this时，默认为window，在严格模式下则为undefined。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

这三个方法都是用来改变某一个函数this关键字指向的

call
当前实例通过原型链的查找机制，找到Function.prototype上的call方法 =》function call() { [native code] }
fn.call(): 把找到的call方法执行
当call方法执行的时候，内部处理的事情
=> 首先把操作函数中的this绑定为第一个参数
=> 把call方法第二个及第二个以后的实参获取到
=> 把要操作的函数执行，并且把第二个以后的传递进来的实参传给函数
call原理:

Function.prototype.call = function(a, 20, 30){
	let param1 = arguments[0],
		paramOther =  [];
	//=>this:fn当前要操作的函数（函数的 一个实例）
	//把fn中的this关键字修改为param1
	//把fn执行，把paramOther分别传给fn
	this(20, 30)
}
function fn1(){console.log(1);}
function fn2(){console.log(2);}
fn1.call(fn2);
fn1.call.call(fn2);
Function.prototype.call(fn1);
Function.prototype.call.call(fn1);
fn1.call.call.call.call(fn2);//2