理解JS call apply

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

有两种使用call的方式,
第一:obj1.method1.call(obj2,argument1,argument2) //参数1,参数2是作为obj1的参数的
这里的call的作用就是把obj1的方法method放到obj2上,然后执行这个方法,后面的argument1..这些做为参数传入。

或者理解为obj2调用了obj1的方法,并把obj2自己的同名方法覆盖掉。
比如
function Class1() 
{
this.name = "class1";

this.showNam = function()
{
alert(this.name);
}
}

function Class2()
{
this.name = "class2";
}

var c1 = new Class1();
var c2 = new Class2();

c1.showNam.call(c2);
弹出class2

第二种方式:
Class1.call(Class2) ,意思就是使用 Class1 对象代替Class2对象中已经定义的同名属性,
(注意这里的Class1,Class2并不是类,而是JS中的函数,当然JS中的函数我们也可以称其为对象)注意,这里是会用Class1中的属性和方法去覆盖Class2中已经出现的同名属性,如果这个属性或是方法在call方法之后出现,那么也会替代刚刚Class1中的属性和方法(可以理解为Class1中的方法和属性的优先级高于Class2中的方法和属性,这样即使Class2的方法和属性后出现,那么也不会覆盖掉Class1中的方法和属性)。比如


<script>
function Class1()
{ var test = "yellow";
this.showTxt = function(txt)
{
alert(test);
}
}

function Class2()
{

Class1.call(this);

this.showTxt = function()
{
alert("test");
}

}

var c2 = new Class2();

c2.showTxt("cc");

</script>
这里就是输出test

这个第二种方式就是JS中继承的一种方式
Class1.call(Class2) Class2就继承了Class1.
但是这种继承是否就跟prototype 一样呢?
答案是否定的
来看一个[url]http://cxy020.iteye.com/blog/1027254[/url]中的例子

<script>
function ClassA(c) {
this.color = c;
}
ClassA.prototype.sayColor = function () {
alert(this.color);
};
function ClassB(c, n) {
ClassA.call(this, c);
this.name = n;
}

var objB = new ClassB("red", "cxy");
objB.sayColor(); //运行报错 不存在这个方法
</script>

这里说明什么?就是他并没有继承A的prototype属性,B之所以没有继承A的prototype属性是由于A类并没有创建一个实例。一个类的prototype对象的属性必须需要实例化后才能拥有。

[size=medium]如果我们要是B继承A的prototype属性 ,只要ClassB.prototype = new ClassA();就可以了[/size]

如下:
<script>
function ClassA(c) {
this.color = c;
}
ClassA.prototype.sayColor = function () {
alert(this.color);
};
function ClassB(c, n) {
ClassA.call(this, c);
this.name = n;
}
ClassB.prototype = new ClassA();
ClassB.prototype.sayName = function () {
alert(this.name);
};

var objA = new ClassA("blue");
var objB = new ClassB("red", "cxy");
objA.sayColor(); //输出 "blue"
objB.sayColor(); //输出 "red"
objB.sayName(); //输出 "cxy"

</script>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值