javascript中Function的两个方法apply()和call()

javascript学到了后面,我逐渐的了解到这两个方法所起的作用,比较大的地方就是应用在对象冒充实现构造函数继承中。

<script type="text/javascript">
	function Box(name, age){
		this.name= name;
		this.age = age;
		this.family = ['哥哥','姐姐']; //引用类型,放在构造里面就不会被共享
	}
	//Box.prototype.family = '家庭'; //不起作用
	function Desk(name, age){
		Box.call(this, name,age);//对象冒充,只能继承构造里的信息
	}
	var desk = new Desk('caibaojian',27);
	alert(desk.family);
	desk.family.push('弟弟');
	alert(desk.family);
	var desk2 = new Desk('jack',22);
	alert(desk2.family);
</script>

当然可能还用在其他方面,不过我还不太明白其作用。 正宗的解释是 call 方法 调用一个对象的一个方法,以另一个对象替换当前对象。 call([thisObj[,arg1[, arg2[, [,.argN]]]]]) 网上有一段例子,很好的解释了这个:

<script type="text/javascript"> 
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> 
<input type="text" id="myText" value="input text">

至于apply的用法则跟call差不多,只不过里面的参数改为了数组。 并且它还可以使用arguments声明来调用:

<script type="text/javascript"> 
function Box(name, age){
this.name= name;
this.age = age;
this.run = function(){
return this.name+" is "+this.age +" year old";
}
};
function SayBox() {
	Box.apply(this,arguments);
}
var sayBox = new SayBox('caibaojian.com',2);
alert(sayBox.run()); // caibaojian.com is 2 year old
</script>

通过这样子的书写前提就是超类中的参数顺序与子类中的参数顺序完全一致时才适用。 在JavaScript中应用好这两个方法,能够帮助你省很多时间,特别是在函数的继承和共享方面。本人深入方面还没学习,留待以后继续补充。

「如果觉得我的文章对您有用,请随意打赏。为什么?

原文链接:javascript中Function的两个方法apply()和call() 版权所有,转载时请注明出处,违者必究。
注明出处格式:前端开发博客 (http://caibaojian.com/javascript%e4%b8%adfunction%e7%9a%84%e4%b8%a4%e4%b8%aa%e6%96%b9%e6%b3%95apply%e5%92%8ccall.html)

发表评论

请登录后发表评论: