JavaScript 的 call函数 和 apply函数的用法

来源:互联网 发布:山东大学生竞赛 知乎 编辑:程序博客网 时间:2024/05/22 08:09

今天无聊的 时候看了下JavaScript..

 看了call函数和apply函数

以前对这两个函数了解的不是很深入。 今天看了忽然就明白了。 哈哈。~~ 赶紧写下来。

让我们先来看一段代码


<script type="text/javascript">var b = function() {alert(this.value);}b();window.b();var b1 = {value:"this is b1"};var b2 = {value:"this is b2"};b.call(b1);</script>

这里,我们定义了一个b函数。 输入value这个值

然后调用b()方法。 应该b函数是在在全局域里定义的。所以b函数是window对象的方法

这里的b()和window.b() 是一个意思。 但是输出来的是 undefined 。 因为window值没有value这个属性。

于是我们定义了两个变量 b1 和 b2 他们都有一个属性value


通过 b.call(b1);  我们通过b把这个函数的上下文(context)也就是作用域改成了b1 ---->>>   call函数就具有这样的功能。 调整上下文。 于是输出了 this is b1


同理b.call(b2) 会输出this is b2。


apply与call函数的意思一样。 只不过参数不一样。 我们再来看一个例子


<script type="text/javascript">var b = function(a,b) {alert(a + b + this.value);}b();window.b();var b1 = {value:"this is b1"};var b2 = {value:"this is b2"};b.call(b1,"a","b");b.apply(b2,["a","b"]);</script>


这个例子只是说明call函数和apply函数的区别。  区别是apply函数的第二个参数必须是一个数组。 否则会出错。


这样,大家应该明白了吧。 。。


我们来扩展一下这两个函数的内容


先看个例子

<script type="text/javascript">var b = {value:"this is myb",show:function() {alert(this.value);}}var b1 = {value:"this is b1"};var b2 = {value:"this is b2"};b.show.call(b1);b.show.call(b2);</script>
在类b里面有个方法show(). 属性b的属性value的值。 可以利用call和apply函数让别的类调用这个类的方法。 非常灵活。


看 b1和 b2 调用了b 的show()方法。。。 


好神奇。。





原创粉丝点击