Javascript apply与call实现继承

发表于 | 分类于

call、apply的作用就是借别人的方法来调用，就像调用自己的一样。

首先apply与call用法与实现的功能是一样的，只是两者调用的时候传递的参数不同。

Function.apply(obj,args)，

obj：这个对象将代替Function类里this对象,

args：这个是数组，它将作为参数传给Function(args–>arguments)。

Function.call(obj,[param1[,param2[,…[,paramN]]]])，

obj：这个对象将代替Function类里this对象,

params：这个是一个参数列表。

两者的主要作用是：替换掉当前执行方法的this对象，从而实现继承，或者修改方法内部的this对象。

下面来看一段实例代码：

1
2
3
4
5
6
7
8
9
10
11
12
function Person(name,age) {
　　this.name = name;
　　this.age = age;
}
function MyInfo(name,age,height) {
　　Person.apply(this,arguments);
　　//Person.call(this,name,age,height);   //call方法的传参方式;    
　　this.height = height;
}
MyInfo.prototype = Object.create(Person.prototype);
var my = new MyInfo("jenkiHuang",24,"173");
console.log("name:" + my.name + ",  age:" + my.age + ",  height:" + my.height);

上面的例子可以很方便看出MyInfo方法里面并没有“name、age”属性，方法内部通过apply方法实现了MyInfo继承Person方法。

其实apply除了方法继承之外还有其他妙用：

1、输出数组中最大的元素:

1
2
3
4
5
6
7
8
var arrs = [1,70,9,180,19,25,100,2,20];
function maxArrs(arrs){
　　return Math.max.apply('',arrs);
}
//不能直接Math.max(数组变量)
//只能Math.max(1,70,9,180,19,25,100,2,20);否则输出NaN
//console.log(Math.max(arrs));    
console.log(maxArrs(arrs));

2、数组的push方法:

1
2
3
4
var arrs1=[5,1,3],arrs2=[3,1,5];
Array.prototype.push.apply(arrs1,arrs2);  //[5, 1, 3, 3, 1, 5]
//arrs1.push(arrs2);    //[5, 1, 3, [3, 1, 5]]
console.log(arrs1);

如果用arrs1.push(arrs2)，输出的是[5,1,3,[3,1,5]]，这样是把arrs2整个数组当成一个元素添加到arrs1，而不是依次添加。

如还有其他妙用欢迎留言告知。