每一javascript function默认都有一些附带的method,如:Function.call(), Function.apply();这两个方法的作用都是将函数绑定到另外一个对象上去运行,两者仅在定义参数方式有所区别:
apply(thisArg,argArray);
call(thisArg[,arg1,arg2…] ]);
即所有函数内部的this指针都会被赋值为thisArg,这可实现将函数作为另外一个对象的方法运行的目的
1、call()method
通过两个实例说明call()的用法
示例一:
var x = 10;
var o = { x: 15 };
function f() {
alert(this.x);
}
f(); //输出10
f.call(o); //输出15
f() : 直接调用f, 而非通过对象实例的引用进行调用, 此时function f(){}中的this指向的是全局对象,示例中的第一行代码定义了一个全局变量x,因此,此时的this.x即返回全局变量x的值
f.call(o) : 通过Function.call()调用f,并传递了一个全局对象o做为参数,此时function f(){}中的this指向的是call方法传入的第一个参数o,因此,此时的this.x返回的就是对象o中的x属性对应的值
示例二:
var x = 10;
var o = { x: 15 };
function f(message) {
alert(message);
alert(this.x);
}
f("invoking f");
f.call(o, "invoking f via call");
该示例主要演示了通过call()传递参数到目标函数,根据该方法的定义,也可以传递多个参数
知识点:
理解在运行时,function f()中this关键字指向或引用的对象,只有在function f()执行时才能确定
2、apply()method
apply()方法和call()方法类似,区别就在于通过apply()传递参数(第二个参数)时,要求参数必须是数组类型
同样通过两个实例说明apply()的用法
示例一:
var x = 10;
var o = { x: 15 };
function f(message, a) {
alert(message);
alert(a);
alert(this.x);
}
f("invoking f");//输出结果 : "invoking f", "undefined", 10
f.apply(o, ["argFirst","argSecond"]);//输出结果 : "argFirst", "argSecond", 15
该示例主要演示了apply()和call()的区别,主要最后一行代码apply()方法中的第二个参数是数组类型,目标函数f()在接收参数时,第一个参数对应数组中的第一个元素,第二个参数对应数组中的第二个元素,以此类推
示例二:
var o = { x: 15 };
function f(message1, message2)
{
alert(message1 + (this.x * this.x) + message2);
}
function g(object, func)
{
// arguments[0] == object
// arguments[1] == func
var args = []; // empty array
// copy all other arguments we want to "pass through"
for(var i = 2; i < arguments.length; i++)
{
args.push(arguments[i]);
}
func.apply(object, args);
}
g(o, f, "The value of x squared = ", ". Wow!");
该示例主要演示了利用apply()要求参数必须是数组的特性,和arguments对象结合编写出灵活优雅的代码
注意: arguments对象并不是数组类型,因此,在for循环中对arguments对象进行了转换
好了,到此call()和apply()两个方法的应用就介绍到此,以上理解主要参考http://odetocode.com/Blogs/scott/archive/2007/07/05/function-apply-and-function-call-in-javascript.aspx 后个人进行的总结和记录,以帮助理解,在此向作者表示感谢!
分享到:
相关推荐
JavaScript中call与apply方法
理解JavaScript的caller callee call apply
JavaScript函数之call、apply以及bind方法案例详解 总结 1、相同点 2、区别 call() 方法 /* 正常模式 */ let obj = { sum(a, b) { console.log(this) return a + b } } // 执行 sum 函数的 apply、bind...
NULL 博文链接:https://ufoqhmdt.iteye.com/blog/1676748
javascript callApply代码示例
一、call和apply的说明 1、call,apply都属于Function.prototype的一个方法,它是JavaScript引擎内在实现的,因为属于Function.prototype,所以每个Function对象实例(就是每个方法)都有call,apply属性。既然作为...
我们可以将call和apply看做是某个对象的方法,通过调用方法的形式来间接调用函数
本文实例分析了JavaScript中call和apply方法的区别。分享给大家供大家参考,具体如下: 这两个方法不经常用,但是在某些特殊场合中是非常有用的,下面主要说下它们的区别: 1、首先,JavaScript是一门面向对象的语言...
淡淡简单描述javascript中方法apply和call
简单的说就是改变函数执行的上下文,... 这两个方法通常被用来类的继承和回调函数: 作用一、类的继承: 先来看这个例子: 代码如下: function Person(name,age){ this.name = name; this.age=age; this.alertName = f
本文主要Javascript中call,apply,bind方法的进行全面分析,并在文章结尾对call,apply,bind方法的联系和区别做了总结,具有很好的参考价值,需要的朋友一起来看下吧
浅谈javascript中的call、apply、bind_.docx
一些简单的Javascript操作中较少会用到call和apply函数,在另外一些较大型的操作中,如web应用开发,js框架开发中可能会经常遇到这两个函数。关于这两个函数的解释,网上的资料也很多,但是本人认为很多资料要么...
主要介绍了javascript中call,apply,bind函数用法,结合实例形式分析了call,apply,bind函数的功能、使用方法与相关注意事项,需要的朋友可以参考下
主要介绍了javascript中call和apply的用法示例分析,非常的详细,需要的朋友可以参考下
js代码-JavaScript的call/apply/bind函数实现
JavaScript中的apply和call函数详解_.docx