本文主要和大家分享几种JS创建对象的方式,希望能帮助到大家。
1、使用原生构造函数创建特定类型的对象
1 2 3 4 5 6 | var person = new Object();
person.name= "wangwu" ;
person.age= "20" ;
person.sayName= function (){
alert(this.name);
}
|
Salin selepas log masuk
2.用对象字面量
1 2 3 4 5 6 7 | var person = {
name: "wangwu" ,
age: "20" ,
sayName: function (){
alert(this.name);
}
}
|
Salin selepas log masuk
小结:这两种方式都可以用来创建单个对象,但是有明显的缺点,使用同一个接口创建很多对象,会产生大量重复代码。
3.使用工厂模式
1 2 3 4 5 6 7 8 9 10 | function createPerson(name,age){
var o= new Object();
o.name=name;
o.age=age;
o.sayName= function (){
alert(this.name);
};
return o;
}
var person1=createPerson( "wangwu" ,20);
|
Salin selepas log masuk
抽象了创建具体对象的过程,发明一种函数,用函数来封装以特定接口创建对象的细节。
4、构造函数模式
1 2 3 4 5 6 7 8 | function Person(name,age){
this.name=name;
this.age=age;
this.sayName= function (){
alert(this.name);
};
}
var person1= new Person( "wangwu" ,20);
|
Salin selepas log masuk
创建自定义的构造函数,从而定义自定义对象类型的属性和方法。
5、原型模式
1 2 3 4 5 6 7 8 9 | function Person(){
}
Person.prototype.name= "wangwu" ;
Person.prototype.age=20;
Person.prototype.sayName= function (){
alert(this.name);
}
var person1= new Person();
person1.sayName();
|
Salin selepas log masuk
我们创建的每个函数都有一个prototype(原型)属性,这个属性是一个指针,指向一个对象,而这个对象的用途是包含可以由特定类型的所有实例共享的属性和方法。原型模式的缺点是省略了为构造函数传递初始化参数这一环节,结果所有实例在默认情况下都取得相同的属性值;原型中所有属性是被很多实例共享的,对于包含引用类型值的属性来说问题就比较突出了。
6、组合使用构造函数模式和原型模式
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 | function Person(name,age){
this.name=name;
this.age=age;
this.friends=[ "wangwu" , "zhangsan" ];
}
Person.prototype={
constructor:Person,
sayName: function (){
alert(this.name);
}
}
var person1= new Person( "wangwu" ,20);
var person2= new Person( "zhangsan" ,23);
person1.friends.push( "lisi" );
alert(person1.friends);
alert(person2.friends);
|
Salin selepas log masuk
7、动态原型模式
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | function Person(name,age,job){
this.name=name;
this.age=age;
this.job=job;
if (typeof this.sayName!= "function" ){
person.prototype.sayName= function (){
alert(this.name);
};
}
}
var friend= new Person( "wangwu" ,20);
friends.sayName();
|
Salin selepas log masuk
8、寄生构造函数模式
1 2 3 4 5 6 7 8 9 10 11 | function Person(name,age){
var 0= new Object();
o.name= "wangwu" ;
o.age=20;
o.sayName= function (){
alert(this.name);
};
return o;
}
var friend= new Person( "wangwu" ,20);
friend.sayName();
|
Salin selepas log masuk
9、稳妥构造函数模式
1 2 3 4 5 6 7 8 9 10 11 12 13 | function Person(name,age,job){
var o= new Object();
o.sayName= function (){
alert(name);
};
return o;
}
var friend=Person( "wangwu" ,20);
friend.sayName();
|
Salin selepas log masuk
相关推荐:
js创建对象的方法汇总(示例代码)
Js创建对象额几种方式
js创建对象的几种常用方式小结(推荐)_js面向对象
Atas ialah kandungan terperinci 几种JS创建对象的方式分享. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!