JavaScript中有一些预定义的类,如Object、Array、String和Number等。类在JavaScript中使用起来非常灵活,创建类的对象时,要使用new关键字,如下面的代码创建:
//样young的博客,未经博主允许不得转载:https://blog.csdn.net/jisuanjiguoba/article/details/80139351 var arrayValues = new Array();//定义数组变量 arrayValues[0] = "a1"; arrayValues[1] = "a2"; arrayValues[2] = "a3";
当类的构造方法没有参数时,可以将括号省略:var arrayValues = new Array。
那么如何在JavaScript中自定义类呢?可以说在JavaScript中自定义类非常灵活,可以通过以下三种方式自定义JavaScript类:
1.工厂方式(动态添加类成员)
由于JavaScript对象的属性可以动态加入,因此可以用如下代码创建一个对象并调用其中的teach方法:
//样young的博客,未经博主允许不得转载:https://blog.csdn.net/jisuanjiguoba/article/details/80139351 var nTeacher= new Object; // 创建一个对象变量 nTeacher.id = '001'; // 定义id属性 nTeacher.xm = '李芳芳'; // 定义xm属性 nTeacher.age = 28; // 定义age属性 nTeacher.teach = function() { alert(this.xm + "样young的博客"); }; nTeacher.teach(); // 调用teach方法
为了使创建对象更加方便,可以建立对象工厂函数来建立Teacher对象,代码如下:
function createTeacher(id, xm, age){ var nTeacher= new Object; // 创建一个对象变量 nTeacher.id = id; // 定义id属性 nTeacher.xm = xm; // 定义xm属性 nTeacher.age = age; // 定义age属性 nTeacher.teach = function() { alert(this.xm + "样young的博客"); }; return nTeacher; // 返回nTeacher对象 }
下面通过createTeacher函数创建两个对象,分别调用这两个对象的teach方法:
var nTeacher1 = createTeacher('002', '赵晓芳', 32); var nTeacher2 = createTeacher('003', '孙芳芳', 33); nTeacher1.teach(); //调用nTeacher1对象的teach方法 nTeacher2.teach(); //调用nTeacher2对象的teach方法
上面的代码在每次建立Teacher对象时都会重新创建teach方法。实际上,可以使多个对象共享同一个teach函数:
//样young的博客,未经博主允许不得转载:https://blog.csdn.net/jisuanjiguoba/article/details/80139351 function teach() { alert(this.xm + "样young的博客"); }; function createTeacher(id, xm, age){ var nTeacher= new Object; // 创建一个对象变量 nTeacher.id = id; // 定义id属性 nTeacher.xm = xm; // 定义xm属性 nTeacher.age = age; // 定义age属性 nTeacher.teach = teach; // 将全局的teach方法赋给Teacher对象的teach方法 return nTeacher; // 返回nTeacher对象 }
2.构造函数方式
构造函数方式创建对象和工厂方式比较类似,如下所示:
//样young的博客,未经博主允许不得转载:https://blog.csdn.net/jisuanjiguoba/article/details/80139351 function teach() { alert(this.xm + "样young的博客"); }; function Teacher(id, xm, age){ this.id = id; // 定义id属性 this.xm = xm; // 定义xm属性 this.age = age; // 定义age属性 this.teach = teach; // 将全局的teach方法赋给Teacher对象的teach方法 } var nTeacher1=new Teacher('002', '赵晓芳', 32); var nTeacher2 = new Teacher('003', '孙芳芳', 33); nTeacher1.teach(); //调用nTeacher1对象的teach方法 nTeacher2.teach(); //调用nTeacher2对象的teach方法
从上面的代码也可以看出,构造函数方式和工厂方式的最大区别就是不在Teacher函数的内部建立对象,而是直接使用this来代表当前的对象实例。
3.原型方式
该方式使用对象的prototype属性,可以把prototype属性看作是创建新对象所依赖的原型。通过使用空构造函数创建一个空类,然后使用prototype属性为该类添加成员(属性和方法),如下所示:
//样young的博客,未经博主允许不得转载:https://blog.csdn.net/jisuanjiguoba/article/details/80139351 function Teacher(){ //建立一个空的构造函数 } Teacher.prototype.id = '002'; // 使用prototype为Teacher类添加属性 Teacher.prototype.xm = '赵晓芳'; Teacher.prototype.age = 32; Teacher.prototype.teach = function() { // 使用prototype为Teacher类添加方法 alert(this.xm + '样young的博客'); }; var nTeacher1 = new Teacher(); nTeacher1.teach();
从上面的代码也可以看出,使用原型方式的另一个好处是可以为已经存在的类添加新的成员(属性或方法),如下为String类添加一个获得字节长度的lenMethod方法:
String.prototype.lenMethod = function(){ return this.replace(/[^\x0-\xf]/g, "##").length; //将中文替换成## } var st = "字母abc"; alert(st.lenMethod()); //显示7,如果直接使用length则会输出5