js面向对象设计

最新推荐文章于 2026-01-08 16:39:17 发布

原创最新推荐文章于 2026-01-08 16:39:17 发布 · 290 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #面向对象 #工厂模式

javascript 专栏收录该内容

4 篇文章

订阅专栏

Ecmascript中没有类的概念，其对象与基于类的语言中的对象有所不同

通过创建多个具有相同属性与方法的对象，

创建对象的方法

1.工厂模式

由于ECMSscript无法创建类，为此利用函数分装定义接口，创建对象的细节

function create(name,age,job){
var o=new Object();
o.name=name;
...
o.sayName=funtion (){
alert(this.name)
}
return o;
}
var person1=create('najoke',34."fjrijierjv")

函数通过接收参数来创建无数个函数，且还有包含一个或者三个属性的出现，但是没有解决对象识别问题，如何知道一个对象的类型。使用构造函数

2.构造函数（反复创建相同结构的对象方法）

构造函数用来创建特定类型的对象，Object、Array、的原生构造函数，此外也可以创建自定义的构造函数，

function Person(name,age,job){
this.name=name;
...
this.sayName=funtion (){
alert(this.name);
   }
}
var person1=create('najoke',34."fjrijierjv")

与工厂模式不同的是，

1）没有显示地创建对象

2）直接将属性和方法传给了this对象

3）没有return语句

注意：构造函数的命名开头字母大写，主要是借助于OO（object-oriented）语言，因为构造函数是函数，只不过用来创建对象。

要创建person的新实例，必须使用new操作符(任何函数，只要通过new调用的，它就可以作为构造函数)

1）创建一个新对象

2）构造函数的作用域赋值给新的对象

3）执行构造函数

4）返回新对象

2.1将构造函数作为函数

添加到window(普通函数的调用)

Person（。。。）；

window.sayname();

在对象的作用域中调用

var o=new Object();

Person.call(o,'参数')；

o.sayname();

2.2构造函数的问题（每个方法上都要在每个实例上重写一遍）

function Person(name,age,job){
this.name=name;
...
this.sayName=sayname;
}
function sayName (){
             alert(this.name);
   }
var person1=create('najoke',34."fjrijierjv")

定义函数在构造函数的外部，就共享了sayname()函数，若定义多个方法，需要定义多个全局函数，则自定义的引用类型就没有分装可言了。由此引出原型模式。

3.原型模式

prototype（原型）属性这是一个指针，指向一个对象，通过调用构造函数创建那个对象实例的原型对象（可以让所有的对象实例共享他的属性和方法）

function Person(){
Person.prototype.name="niloj";
...
Person.prototype.sayname=function(){...}
}
var person1=new Person();
person1.sayname();

[[Prototype]]是通过构造函数创建那个对象的实例的原型对象，原型对对象的好处是可以让所有的对象实例共享他所包含的属性和方法，也就是说

不需要在构造函数中定义对象的实例信息，而是将这些信息添加到原型对象中。

当原型模式构建主函数时，new的实例对象修改原型中的属性值，就会覆盖原型的值，则其他new函数的属性值就是该覆盖值，但是实例的函数值都是独有的，这里使用原型不合适。

4 组合使用构造函数模式和原型模式

该方法就是用构造函数的方法构造实例属性，原型模式定义方法和共享的属性，极大的节省了

function Person(name,age,job){
this.name=name;
...
this.friends={"shell","tom"};
}
Person.prototype.
={constructor：Person,
...
sayname=function(){...}}
var person1=new Person("ttt",23,"sdoefjifj");
var person2=new Person("tt3",26,"sdfrjifj");
person1.friends.push("van");
aler(person1.friends);    //"shell","tom"
aler(person1.friends);   //"shell","tom","van"        构造函数
alert(person1.sayname==person2.sayname);     //true    原型继承

5 动态原型模式

其他OO开发人员看到独立的原型与构造函数，会利用动态构造函数将所有的信息都分装在构造函数中，通过构造函数的初始化原型，有带有构造函数与原型函数的优点。

function Person(name,age,job){
this.name=name;
...
this.friends={"shell","tom"};
if(typeof this.sayname!="function")
Person.prototype.sayname=function(){alert(this.name)}
}

其中若构造函数不存在，使用该方法只需对一个实例对象执行函数的调用，可以对其原型添加属性

在使用动态构造函数的方法时，是不能重写原型的，否则会切断原型与

6寄生构造函数（同工厂模式）

前几种模式不合适的情况下，使用寄生构造函数创建一个对象，进行封装，最后返回新创建的对象

7 稳妥构造函数模式

没有公共属性，方法不能使用this的对象和new对象

（instanceof对此无法生效，因为与寄生构造函数一样，创建的对象与构造函数没啥关系）