关于JavaScript中apply与call的用法意义及区别

简介: JavaScript中有一个call和apply方法,其作用基本相同,但也有略微的区别。先来看看JS手册中对call的解释:call 方法调用一个对象的一个方法,以另一个对象替换当前对象。call([thisObj[,arg1[, arg2[,   [,.argN]]]]])参数thisObj可选项。

JavaScript中有一个call和apply方法,其作用基本相同,但也有略微的区别。

先来看看JS手册中对call的解释:

call 方法
调用一个对象的一个方法,以另一个对象替换当前对象。

call([thisObj[,arg1[, arg2[,   [,.argN]]]]])

参数
thisObj
可选项。将被用作当前对象的对象。

arg1, arg2,  , argN
可选项。将被传递方法参数序列。

说明
call 方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。

如果没有提供 thisObj 参数,那么 Global 对象被用作 thisObj。

说明白一点其实就是更改对象的内部指针,即改变对象的this指向的内容。这在面向对象的js编程过程中有时是很有用的。

引用网上一个代码段,运行后自然就明白其道理。

< input type ="text" id ="myText"    value ="input text" >
< script >
   
function Obj(){ this .value = " 对象! " ;}
   
var value = " global 变量 " ;
   
function Fun1(){alert( this .value);}

    window.Fun1();  
// global 变量
    Fun1.call(window);  // global 变量
    Fun1.call(document.getElementById('myText'));  // input text
    Fun1.call( new Obj());   // 对象!
</ script >

call函数和apply方法的第一个参数都是要传入给当前对象的对象,及函数内部的this。后面的参数都是传递给当前对象的参数。
运行如下代码:
< script >
  
var func = new function (){ this .a = " func " }
   
var myfunc = function (x){
       
var a = " myfunc " ;
        alert(
this .a);
        alert(x);
    }
    myfunc.call(func,
" var " );
</ script >

可见分别弹出了func和var。到这里就对call的每个参数的意义有所了解了。

对于apply和call两者在作用上是相同的,但两者在参数上有区别的。
对于第一个参数意义都一样,但对第二个参数:
apply传入的是一个参数数组,也就是将多个参数组合成为一个数组传入,而call则作为call的参数传入(从第二个参数开始)。

如 func.call(func1,var1,var2,var3)对应的apply写法为:func.apply(func1,[var1,var2,var3])

同时使用apply的好处是可以直接将当前函数的arguments对象作为apply的第二个参数传入
目录
相关文章
|
12天前
|
JavaScript 前端开发
JS高级—call(),apply(),bind()
【10月更文挑战第17天】call()`、`apply()`和`bind()`是 JavaScript 中非常重要的工具,它们为我们提供了灵活控制函数执行和`this`指向的能力。通过合理运用这些方法,可以实现更复杂的编程逻辑和功能,提升代码的质量和可维护性。你在实际开发中可以根据具体需求,选择合适的方法来满足业务需求,并不断探索它们的更多应用场景。
6 1
|
17天前
|
JavaScript 前端开发
JS try catch用法:异常处理
【10月更文挑战第12天】try/catch` 是 JavaScript 中非常重要的一个特性,它可以帮助我们更好地处理程序中的异常情况,提高程序的可靠性和稳定性。
11 1
|
17天前
|
存储 JavaScript 前端开发
JavaScript 数据类型详解:基本类型与引用类型的区别及其检测方法
JavaScript 数据类型分为基本数据类型和引用数据类型。基本数据类型(如 string、number 等)具有不可变性,按值访问,存储在栈内存中。引用数据类型(如 Object、Array 等)存储在堆内存中,按引用访问,值是可变的。本文深入探讨了这两种数据类型的特性、存储方式、以及检测数据类型的两种常用方法——typeof 和 instanceof,帮助开发者更好地理解 JavaScript 内存模型和类型检测机制。
38 0
JavaScript 数据类型详解:基本类型与引用类型的区别及其检测方法
|
22天前
|
JavaScript 前端开发
js的math.max的用法
js的math.max的用法
21 6
|
22天前
|
JavaScript
JS中的splice的三种用法(删除,替换,插入)
JS中的splice的三种用法(删除,替换,插入)
109 4
|
22天前
|
存储 JavaScript 前端开发
js中函数、方法、对象的区别
js中函数、方法、对象的区别
14 2
|
27天前
|
JavaScript 前端开发
js 中call()和apply()
js 中call()和apply()
27 1
|
21天前
|
前端开发 JavaScript 开发者
深入理解JavaScript中的Promise:用法与最佳实践
【10月更文挑战第8天】深入理解JavaScript中的Promise:用法与最佳实践
43 0
|
2月前
|
自然语言处理 JavaScript 前端开发
JS中this的应用场景,再了解下apply、call和bind!
该文章深入探讨了JavaScript中`this`关键字的多种应用场景,并详细解释了`apply`、`call`和`bind`这三个函数方法的使用技巧和差异。
|
3月前
|
JavaScript 前端开发
深入浅出 妙用Javascript中apply、call、bind
【8月更文挑战第1天】深入浅出 妙用Javascript中apply、call、bind
27 0