其实在JS中是没有类这个概念的,它没有像Class那样的专门定义的类,但我们一般可以通过对对象创建的模拟把它模拟成类。
书上介绍了几种创建类的方式,在这里:
1.工厂方式:这个方式在函数内部定义对象,并定义各种属性,最后返回对象。一般如果用这个的话我们把属性方法定义在函数外面,这样就可以避免重复创建该方法。
function Student1(name,age){ var obj=new Object(); obj.name=name; obj.age=age; obj.f=f; return obj; } var f=function(){ return (this.name+" "+this.age); } var student1=Student1("jk","12"); console.log(student1.name+" "+student1.age+" "+student1.f()); //jk 12 jk 12 if(student1 instanceof Student1){console.log("Y")}else{console.log("N")} //N
只是上面这种方式无法进行对对象的类型的识别的,也就是说无法通过instanceof方法判断它属于那个类。
2.构造函数方式:这个方式使用构造函数创建对象,不用在函数内部创建,而使用this指代,不用return。同上一样,如果用这个就要把方法定义在外面。
function Student2(name,age){ this.name=name; this.age=age; this.f=f; } var f=function(){ return (this.name+" "+this.age); } var student2=new Student2("jk","12"); console.log(student2.name+" "+student2.age+" "+student2.f()); //jk 12 jk 12 if(student2 instanceof Student2){console.log("Y")}else{console.log("N")} //Y
3.原型方式:在函数中不对属性进行定义,然后利用prototype的属性进行属性定义。
function Student3(name,age){ } Student3.prototype={ name:null, age:null, f:function(){ return this.name+" "+this.age; } }; var student3=new Student3; student3.name="jk"; student3.age="12"; console.log(student3.name+" "+student3.age+" "+student3.f()); //jk 12 jk 12
只是单单用原型方式的话不是很好,因为当这个类有一个引用属性时,改变一个对象的这个属性也会改变其他对象得属性。比如一个Array再push进去东西的话,其他的对象属性也会更改。
4.混合的构造函数和原型模式(都推荐使用的是这个):将所有的不是方法的属性定义在函数中,将所有方法属性利用prototype定义在函数外面:
function Student4(name,age){ this.name=name; this.age=age; } Student4.prototype.f=function(){ return this.name+" "+this.age; } var student4=new Student4("jk",12); console.log(student4.name+" "+student4.age+" "+student4.f()); ////jk 12 jk 12
这个是使用率最高的一种方式,也没有上面那些缺点。
5.动态原型方式(这个也是常用的):这个和上面那个是差不多的,都是在不是方法的属性定义在函数中,所有方法利用prototype定义。唯一的区别是赋予对象方法的位置。
function Student5(name,age){ this.name=name; this.age=age; if(typeof Student5.f=="undefined"){ Student5.prototype.f=function(){ return this.name+" "+this.age; } Student5.f=true; } } var student5=new Student5("jk",12); console.log(student5.name+" "+student5.age+" "+student5.f()); //jk 12 jk 12
上面一些就是类的创建的方法,然后类的继承的话最简单的是通过利用共享prototype实现继承,先看下例子:
function Student6(name,age){ this.name=name; this.age=age; } Student6.prototype.f1=function(){ return this.name; } Student6.prototype.f2=function(){ return this.age; } function Candle(name,age,islight){ this.name=name; this.age=age; this.islight=islight; } Candle.prototype=Student6.prototype; //也可以这样Candle.prototype=new Student6(); Candle.prototype.f3=function(){ return this.islight; } var student6=new Student6("jk",12); console.log(student6.f1()+" "+student6.f2()); //jk 12 var candle=new Candle("jk",12,"no"); console.log(candle.f1()+" "+candle.f2()+" "+candle.f3()); //jk 12 no console.log(candle instanceof Student6); //true console.log(candle instanceof Candle); //true
上面的例子中第二个类继承了第一个类的f1和f2的方法,这是通过拷贝第一个类的prototype到第二个来实现的。然后用instanceof来判断了下对象是否是这两个类的实例是OK的。因为这个是用共享prototype的方法来实现定义的,是对同一个对象的引用,所以惟一的约束是不允许类成员的覆盖定义。
上面那种方法在不要求严格的情况下,这样的继承是比较简单方便的。但是毕竟如果成员的重新定义都会互相有影响,所以还有一种方法是通过反射机制和prototype实现继承,思路和上面那个差不多,但利用for(…in…)语句枚举出所有基类prototype的成员,并将其赋值给子类的prototype对象。下面是例子:
function Student7(name,age){ this.name=name; this.age=age; } Student7.prototype.f1=function(){ return this.name; } Student7.prototype.f2=function(){ return this.age; } function Candle(name,age,islight){ this.name=name; this.age=age; this.islight=islight; } //让Candle继承于Student7 for(var p in Student7){ Candle.prototype[p]=Student7.prototype[p]; } Candle.prototype.f1=function(){ //覆盖第一个类的f1方法 return this.age; } Candle.prototype.f2=function(){ //覆盖第一个类的f2方法 return this.name; } Candle.prototype.f3=function(){ return this.islight; } var student7=new Student7("jk",12); console.log(student7.f1()+" "+student7.f2()); //jk 12 var candle=new Candle("jk",12,"no"); console.log(candle.f1()+" "+candle.f2()+" "+candle.f3()); //12 jk no
OK,上面的那些就是关于js类的创建和继承,如有新东西可以继续补充~