最近一直在学Javascript,打算写一些文章,算做自己的学习心得吧,也可以算是学习笔记。没有系统的知识点,太基础的不想写,主要是写一些自己觉得有价值的地方。
今天写第一篇。
Javascript究竟是一门面向对象的语言,还是一门支持对象的语言,我想每个人都有着自己的看法。那些Javascript忠实的Fans一定讲Javascript是一门面向对象的语言,像《Javascript王者归来》一书中对Javascript的说法是基于原型的面向对象。我谈谈我个人的看法。面向对象的三个特征,继承,多态,封装,Javascript虽然实现起来不像Java,C#等面向对象的语言来得快,但是毕竟也有着一定的支持。因此说Javascript是面向对象的语言是有着一定道理的,但是从继承这个部分来谈,一系列的继承法,但是每个继承法都无法实现真正面向对象语言的威力,因此,说他面向对象有着一定的牵强。综上,我对Javascript的理解,更愿意把它叫做一种简化的面向对象,或者说"伪"面向对象(这个伪字绝无贬义)。
今天就从面向对象这个第一个特征:继承来谈。
什么是继承?这个我不想废话,有一只动物,有一个人,有一个女孩,这个就是一个最简单,也是典型的继承链。
在C#等面向对象中,很容易。
class Animal
{ }
class People:Animal
{ }
class Girl:People
{ }
那么在Javascript中,没有类,没有继承的提供实现,我们该怎么做呢?
对象伪装(构造继承法)
什么是对象伪装呢?我们可能叫做构造继承更容易理解一些。顾名思义,就是用构造函数来玩继承。其实就是说把父类的构造函数当成是一个普通的方法,放到子类的构造函数中去执行,这样的话,当构造对象的时候,子类的对象当然就可以构造父类的方法啦!
还是用上面的那个例子,代码如下:
function Animal()
{
this.Run=function(){alert("I can run");};
}
function People(name)
{
//在这里就是传入了父类的构造方法,然后执行父类的构造方法,这个时候就//可以使用父类中的方法了。
this.father=Animal;
this.father();
//记得要删除,否则在子类添加于父类相同名称的方法时,会修改到父类。
delete this.Father;
this.name=name;
this.Say=function(){alert("My name is "+this.name);}
}
function Girl(name,age)
{
this.father=People;
this.father(name);
delete this.father;
this.age=age;
this.Introduce=function(){alert("My name is "+this.name+".I am "+this.age);};
}
这样的话就实现了一个继承链,测试下:
var a=new Animal();
a.Run();
var p=new People("Windking");
p.Run();
p.Say();
var g=new Girl("Xuan",22);
g.Run();
g.Say();
g.Introduce();
结果如下:
a.
b.
c.
d.
e.
f.
测试成功!
我们来总结一下这段代码的关键,指定父类,声明父类对象,然后删除临时变量,您是否觉得有些麻烦呢?至少我是这么觉得的,一旦忘记了delete,还要承担父类被修改的风险,针对这个,我们对这个用call和apply来改进!
接着看代码,还是上面的例子(为了更加容易大家理解,需求改变一下,Animal有了名字):
function Animal(name)
{
this.Run=function(){alert("I can Run");};
}
function People(name)
{
//使用call方法实现继承
this.father=Animal;
this.father.call(this,name);
this.name=name;
this.SayName=function(){alert("My name is "+this.name;);};
}
function Girl(name,age)
{
//使用apply方法来实现继承
this.father=People;
this.father.apply(this,new Array(name));
this.age=age;
this.Introduce=function(){alert("My name is "+this.name+".I am "+this.age);};
}
用一样的测试代码,发现测试一样成功。
对象伪装,这只是一种实现继承的方式。
上面主要介绍了对象伪装来实现继承。我们在这里先来说一下这种方式的优缺点。
毋庸置疑,这种方式是比较容易理解的,在子类中调用父类的构造函数。另外,这种方法最大的一个优点就是说构造继承可以实现多继承,复习下这个代码:
function A()
{ }
function B()
{ }
function C()
{
this.father=A;
this.father();
delete this.father;
this.father=B;
this.father();
delete this.father;
}
但是这种方式也有着这样和那样的缺点:
熟悉面向对象的我们来看这样一段C#代码:
class Program
{
static void Main(string[] args)
{
B b=new B();
bool temp = (typeof(A)).IsInstanceOfType(b);
Console.WriteLine(temp);
}
}
class A
{
public A()
{
}
}
class B : A
{
public B()
{
}
}
结果呢?b当然是A的一个实例:
然而我们对上面的那段使用构造继承的Javascript代码做这样的测试:
function A()
{ }
function B()
{ }
function C()
{
this.father=A;
this.father();
delete this.father;
this.father=B;
this.father();
delete this.father;
}
var c=new C();
alert(c instanceof A);
可是得到的结果却不是我们想象的那样:
其实很容易解释:构造继承只是通过了调用父类的构造方法复制的父类的属性,其他的什么搜没有做,所以很多资料中并不把这种继承方式称做继承。
看到缺点的同时也记住优点:支持多继承。
我们看C# 的继承,发现与这个继承有两个最典型的不同:C#不支持多继承,以及我上面提到的构造继承的缺点。于是就产生了一种新的继承方式,我们成为原型继承。
看到名字,可以大致理解,原型继承就是使用原型(prototype)的特性来实现继承的。这是在Javascript最流行的一种继承方式。如果对原型有不理解,请关注我的另一篇文章:《玩转原型——prototype》。
我们先来看代码,在这里,我借鉴《Javascript王者归来》中的一段代码:
function Point(dimension)
{
this.dimension=dimension;
this.Test=function(){
alert("Success");
}
}
function Point2D(x,y)
{
this.x=x;
this.y=y;
}
Point2D.prototype=new Point(2);
var p=new Point2D(3,4);
p.Test();
测试通过。说明Point2D已经继承了父类的方法,再看看instance。
alert(p instanceof Point);
成功!好,我们来分析下原型继承:
原型继承的优点我不再多说,结构简单,容易理解,而且可以instance。但是他的缺点同样显著,还记得我上一篇关于Animal,People,Girl的例子么?我们用原型继承来实现下:
function Animal()
{
this.Run=function(){alert("I can run");};
}
function People(name)
{
this.Say=function(){alert("My name is "+this.name);}
}
People.prototype=new Animal();
function Girl(name,age)
{
this.age=age;
this.Introduce=function(){alert("My name is "+this.name+".I am "+this.age);};
}
Girl.prototype=new People(???);
大家注意看我红色加粗部分的那行代码,People是Girl的原型,那么我们在初始化People的时候就应该传入name参数,但是每个Girl的名字是不一样的,所以原型继承不使用的场合一:在原型继承阶段你不能确定用什么参数来初始化父类对象。场合二:很简单,每一个类只能有一个原型,那么也就是说,原型继承不能用于多继承。这是件好事,也是件坏事。因为:
在Java和C#等面向对象语言中,本来就不支持多继承,并且认为多继承是不符合面向对象的
无法实现多个接口了!
好了,今天就写到这,总结下,Prototype继承解决了构造继承的一些问题,又引入了一些新的问题。总体来说,原型继承是应用最广泛的继承方式,也是Javascript文法中真正意思上实现继承的方式!
介绍了构造继承和原型继承。今天把剩下的两种写完,这两种的应用相对于前两种来说应用很少,因此我把他们称为是非主流继承方式。
首先,我们来看非主流继承一:实例继承法。
我也不说那么多废话了,既然是非主流继承,就一定不常用,既然不常用还存在,那就只有一个因素,他用于特定的场合。实例继承法,就主要用于核心对象的继承,也是目前为止唯一能够解决核心对象继承的方式。
核心对象的继承拥有一定的价值,比如说Error对象,我们公司可能要自己实现一个Error 类来简化今后的开发,那么这个时候我就要使用实例继承法来继承Error。
代码如下:
function ExtendingError(mes)
{
var instance=new Error(mes);
instance.NewError=function(){
alert("Your Error is "+mes);
}
return instance;
}
好,测试下:
var e=new ExtendingError("Your number is less than one");
e.NewError();
alert(e.toString());
结果让我们满意:
好,废话不多说,这个是非主流继承方式,基本只用于核心对象的继承,记住就好!
接下来看看非主流继承二:拷贝继承法.
顾名思义,拷贝继承,就是通过拷贝实现对象的继承,拷贝什么呢?很明显,就是对象的属性和方法,还记得Javascript中,类其实就一个Hashtable么?如果想不起来的话,就回去复习一下基础,我可能会在过一段时间写一篇关于Javascript对象的知识。
了解了这个就好办了,直接看代码:
首先写一个Extend方法:
Function.prototype.Extend=function(){
for(var pro in obj)
{
//这样其实就是把父类的属性和方法完全复制过去了
this.prototype[pro]=obj[pro];
}
}
好了,再写段代码看下如何使用:
function Animal()
{ }
function People()
{ }
People.Extend(new Animal())
{ }
明眼人一眼看出来,这个方法的缺点太明显了:
将对象的属性方法一一复制的时候,其实用的是反射,反射对效率的损伤我就不多说了。
和原型继承一样,必须初始化父类对象,当确定继承关系时,但是参数还不确定时,玩不转!
总之,这个方法一般情况下不用。
好了,下面说个常用的东西。混合继承!
这个是基于两个主流继承方式的。对比两个继承方式,我们可以发现两个继承方式的优缺点是互补的,那就好办了,混合到一起吧!
function People(name)
{
this.name=name;
this.SayName=function(){
alert("My name is "+name);
}
}
function Girl(name,age)
{
//构造继承
this.father=People;
this.father(name);
delete this.father;
this.Introduce=function(){
alert("My name is "+name+".I am"+age);
}
}
//原型继承
Girl.prototype=new People();
好了,两种方式的混合,现在看看,是不是问题解决了呢?
var g=new Girl("Xuan",22);
alert(g instanceof People);
g.SayName();
g.Introduce();
测试通过!
这是一个相对完美的解决方案,但是却增加了代码的复杂度,所以具体的方案还要靠大家在实践中去选择。