日期:2014-05-16 浏览次数:20539 次
一、最基本的创建方式
var obj = new Object(); obj.name = "zhangsan"; obj.age = 22; obj.sayHello = function(){ alert("hello,I'm "+this.name); }
?可以这样调用:
obj.sayHello();//hello,I'm zhangsan
?优点:创建简单,容易理解
?缺点:如果想创建更多的相同类型的对象,每创建对象时都要去重新定义属性和方法
????????? 代码量加大,不易维护。
????????? 不能创建指定类型的对象,都是object类型的。
?
二、工厂方法模式
把对象的创建过程封装在函数里面
function createObject(name,age){ var obj = new Object(); obj.name = name; obj.age = age; obj.sayHello = function(){ alert("hello,I'm "+this.name); } return obj; } var o2 = createObject("zhangsan",33); o2.sayHello();
?优点:对象的创建方式变得简易了。创建对象只需调用该方法
?缺点:依然没有解决直接创建方式所带来的“不能创建指定类型的对象”问题
?
三、构造函数模式
function Person(name,age){ this.name = name; this.age = age; this.sayHello = function(){ alert("hello,I'm "+name); } } var obj = new Person("zhangsan",22); obj.sayHello();
?优点:解决了前面两种创建方式没有解决的问题,可以创建指定的对象类型
alert(obj instanceof Person); //true alert(typeof obj); //object
?缺点:以上所有方式都存在的一个问题就是:每创建一个实例对象,都会创建一个Function的实例,即代码:
sayhello=function(){ alert("hello,I'm "+this.name); } //上面代码等同于 sayHello = new Function(){ alert("hello,I'm "+this.name); }
?这样造成资源的浪费,一种解决方案就是把方法提取出来
function Person(name,age){ this.name = name; this.age = age; this.sayHello = sayHello; } function sayHello(){ alert("hello,I'm "+this.name); }
?旧问题解决的,但是新的问题也接踵而来,因为这个全局的sayhello 方法本是为Person类型的对象服务的,但却又放在全局作用域中(在浏览器中可以理解为window对象的作用域)
?还有一个问题就是他的封装性失去意义。这样就衍生了下面一中模式
?
四、原型模式
先看代码:
function Person(){ } Person.prototype.name = "zhangsana"; Person.prototype.age = 22; Person.prototype.sayHello = function(){ alert("hello,I'm "+this.name); } var obj1 = new Person(); obj1.sayHello();
?prototype作为每个函数都有的属性,指向一个对象,该对象为特定类型的所有实例共享属性和方法的对象,也就是说,拿上面代码说就是但凡有Person构造方法new 出来的对象都共享name,age,sayHello,而且这下属性和方法内存中只存在一份。附一张草图以便理解,有时间继续写。。。(参考书籍:Professional JavaScript for web Developers Second Edition? Nicholas C. Zalas)
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?