apply和call方法是JavaScript中用于改变函数执行上下文(this指向)的两种常用方法。它们的定义及区别如下:
apply和call方法是JavaScript中用于改变函数执行上下文(this指向)的两种常用方法。它们的定义及区别如下:
apply方法定义及使用
apply方法是函数对象的原型方法,它可以改变函数的this指向,并且接受两个参数,第一个参数是函数上下文,第二个参数是数组,这个数组中的每个元素都是传递给函数的参数。
apply方法的使用方式如下:
function func(arg1, arg2) {
console.log(this.name, arg1, arg2);
}
var obj1 = {name: "obj1"};
var obj2 = {name: "obj2"};
func.apply(obj1, ["arg1", "arg2"]); // 输出:"obj1 arg1 arg2"
func.apply(obj2, ["arg3", "arg4"]); // 输出:"obj2 arg3 arg4"
在上述代码中,我们定义了一个函数func,然后通过调用apply方法,将其上下文分别设为obj1和obj2,并传递不同的参数,可以看到输出结果分别是"obj1 arg1 arg2"和"obj2 arg3 arg4"。
call方法定义及使用
call方法与apply方法类似,同样可以改变函数的this指向,但是它接受的参数不同。它的第一个参数也是函数上下文,但后面的参数与apply方法不同,它接受的是一个一个的参数,而不是数组。
call方法的使用方式如下:
function func(arg1, arg2) {
console.log(this.name, arg1, arg2);
}
var obj1 = {name: "obj1"};
var obj2 = {name: "obj2"};
func.call(obj1, "arg1", "arg2"); // 输出:"obj1 arg1 arg2"
func.call(obj2, "arg3", "arg4"); // 输出:"obj2 arg3 arg4"
在上述代码中,我们同样定义了一个函数func,然后通过调用call方法,将其上下文分别设为obj1和obj2,并传递不同的参数,可以看到输出结果同样分别是"obj1 arg1 arg2"和"obj2 arg3 arg4"。
apply和call方法的区别
两种方法的参数传递方式不同,apply方法接受一个数组参数,call方法接受一系列单独的参数。这意味着我们需要了解到函数需要多少个参数才能确定该使用哪种方法。
除此之外,两种方法在函数执行的语境上稍有不同,apply方法传递的数组参数中的元素将会一一对应地赋值给函数的形参,而call方法则直接将其后的参数列表中的参数按照顺序赋值给函数的形参。
示例代码如下:
function func(arg1, arg2) {
console.log(this.name, arg1, arg2);
}
var obj1 = {name: "obj1"};
var obj2 = {name: "obj2"};
func.call(obj1, "arg1", "arg2"); // 输出:"obj1 arg1 arg2"
func.apply(obj2, ["arg3", "arg4"]); // 输出:"obj2 arg3 arg4"
在上述代码中,我们在两次调用中分别使用call和apply方法,可以看到两种方法的参数传递方式是不同的,虽然最终的结果都是将函数的上下文改变为了obj1和obj2,并传递给了不同的参数。
本文标题为:apply和call方法定义及apply和call方法的区别


基础教程推荐
- 微信小程序开发之全局配置与页面配置实现 2022-08-30
- 完美实现CSS垂直居中的11种方法 2022-11-16
- 使用FormData进行Ajax请求上传文件的实例代码 2023-02-22
- css实现三栏布局的几种方法及优缺点 2023-12-11
- vue-cli 卸载版本及安装指定版本的命令 2023-10-08
- php – 将mySQL记录显示为HTML表格列 2023-10-26
- 深入浅析CSS 选择器分组 2023-12-12
- Ajax解决多余刷新的两种方法(总结) 2023-01-31
- JavaScript中高阶函数的巧妙运用 2023-07-10
- SSH+Jquery+Ajax框架整合 2022-10-17