【转】javascript中创建对象的四种模式

http://www.51testing.com/html/79/291779-855125.html

//以下代码可在nodejs中执行
//第一种:工厂模式
//缺点:无法知道对象的类型
function createPage(name) {
//interface
var o = new Object();
o.name = name;

o.loadPage = function() {
console.log(this.name);
};
return o;
}
var googleHomepage = createPage("googleHome");
googleHomepage.loadPage();

//第二种:构造函数模式
//优点:可传递参数
//缺点:每个方法都会在每个实例上重新创建一遍,验证点在最后一句
function Page(name) {
this.name = name;
this.loadPage = loadPage;
}

loadPage = function() {
console.log(this.name);
};
var googleHomepage = new Page("googleHome");
//true
console.log(googleHomepage instanceof Page);
var googleHomepage1 = new Page("googleHome1");
//true
console.log(googleHomepage instanceof Page);
//false
console.log(googleHomepage.loadPage == googleHomepage1.loadPage);

//第三种:原型模式
//优点:可以让所有对象实例共享它所包含的属性和方法,即用以解决第二种的问题
//缺点:对于包含引用类型值(如数组)的属性来说,共享其属性不是我们预期的
function Page() {
}

Page.prototype.name = "googleHome";
Page.prototype.tabs = ["image", "map", "search"];
Page.prototype.loadPage = function() {
console.log(this.name);
};

var googleHomepage = new Page();
googleHomepage.loadPage();

var googleHomepage1 = new Page();
googleHomepage1.loadPage();
//true
console.log(googleHomepage.loadPage == googleHomepage1.loadPage);

//验证其缺点
googleHomepage.tabs.push("music");
console.log(googleHomepage.tabs); //image, map, search, music
console.log(googleHomepage1.tabs); //image, map, search, music

//第四种:组合使用构造函数模式和原型模式
//构造函数用于定义实例属性,原型用于定义方法和共享的属性
//是用来定义引用类型的一种默认模式
function Page(name) {
this.name = name;
this.tabs = ["image", "map", "search"];
}
//字面量
Page.prototype = {
constructor : Page,
loadPage : function() {
console.log(this.name);
}
}

var googleHomepage = new Page("googleHome");
googleHomepage.loadPage();

var googleHomepage1 = new Page("googleHome1");
googleHomepage1.loadPage();
//true
console.log(googleHomepage.loadPage == googleHomepage1.loadPage);

//修改googleHomepage不会影响到googleHomepage1
googleHomepage.tabs.push("music");
console.log(googleHomepage.tabs); //image, map, search, music
console.log(googleHomepage1.tabs); //image, map, search

//小知识点:使用对象字面量重写原型(如第四种中使用),则会切断现有实例与新原型之间的联系.(继承时会有影响)