学步园

今天无聊的 时候看了下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()方法。。。 

好神奇。。