1、new 操作符 + Object 創建對象
var person = new Object(); person.name = "lisi"; person.age = 21; person.family = ["lida","lier","wangwu"]; person.say = function(){ alert(this.name); }
2、字面式創建對象
var person ={ name: "lisi", age: 21, family: ["lida","lier","wangwu"], say: function(){ alert(this.name); } };
以上兩種方法在使用同一接口創建多個對象時,會產生大量重復代碼,為了解決此問題,工廠模式被開發。
3、工廠模式
function createPerson(name,age,family) { var o = new Object(); o.name = name; o.age = age; o.family = family; o.say = function(){ alert(this.name); } return o; } var person1 = createPerson("lisi",21,["lida","lier","wangwu"]); //instanceof無法判斷它是誰的實例,只能判斷他是對象,構造函數都可以判斷出 var person2 = createPerson("wangwu",18,["lida","lier","lisi"]); console.log(person1 instanceof Object); //true
工廠模式解決了重復實例化多個對象的問題,但沒有解決對象識別的問題(但是工廠模式卻無從識別對象的類型,因為全部都是Object,不像Date、Array等,本例中,得到的都是o對象,對象的類型都是Object,因此出現了構造函數模式)。
4、構造函數模式
function Person(name,age,family) { this.name = name; this.age = age; this.family = family; this.say = function(){ alert(this.name); } } var person1 = new Person("lisi",21,["lida","lier","wangwu"]); var person2 = new Person("lisi",21,["lida","lier","lisi"]); console.log(person1 instanceof Object); //true console.log(person1 instanceof Person); //true console.log(person2 instanceof Object); //true console.log(person2 instanceof Person); //true console.log(person1.constructor); //constructor 屬性返回對創建此對象的數組、函數的引用
對比工廠模式有以下不同之處:
1、沒有顯式地創建對象
2、直接將屬性和方法賦給了 this 對象
3、沒有 return 語句
以此方法調用構造函數步驟:
1、創建一個新對象
2、將構造函數的作用域賦給新對象(將this指向這個新對象)
3、執行構造函數代碼(為這個新對象添加屬性)
4、返回新對象 ( 指針賦給變量person ??? )
可以看出,構造函數知道自己從哪里來(通過 instanceof 可以看出其既是Object的實例,又是Person的實例)
構造函數也有其缺陷,每個實例都包含不同的Function實例( 構造函數內的方法在做同一件事,但是實例化后卻產生了不同的對象,方法是函數 ,函數也是對象)
因此產生了原型模式
5、原型模式
function Person() { } Person.prototype.name = "lisi"; Person.prototype.age = 21; Person.prototype.family = ["lida","lier","wangwu"]; Person.prototype.say = function(){ alert(this.name); }; console.log(Person.prototype); //Object{name: 'lisi', age: 21, family: Array[3]} var person1 = new Person(); //創建一個實例person1 console.log(person1.name); //lisi var person2 = new Person(); //創建實例person2 person2.name = "wangwu"; person2.family = ["lida","lier","lisi"]; console.log(person2); //Person {name: "wangwu", family: Array[3]} // console.log(person2.prototype.name); //報錯 console.log(person2.age); //21
原型模式的好處是所有對象實例共享它的屬性和方法(即所謂的共有屬性),此外還可以如代碼第16,17行那樣設置實例自己的屬性(方法)(即所謂的私有屬性),可以覆蓋原型對象上的同名屬性(方法)。
6、混合模式(構造函數模式+原型模式)
構造函數模式用於定義實例屬性,原型模式用於定義方法和共享的屬性
function Person(name,age,family){ this.name = name; this.age = age; this.family = family; } Person.prototype = { constructor: Person, //每個函數都有prototype屬性,指向該函數原型對象,原型對象都有constructor屬性,這是一個指向prototype屬性所在函數的指針 say: function(){ alert(this.name); } } var person1 = new Person("lisi",21,["lida","lier","wangwu"]); console.log(person1); var person2 = new Person("wangwu",21,["lida","lier","lisi"]); console.log(person2);
可以看出,混合模式共享着對相同方法的引用,又保證了每個實例有自己的私有屬性。最大限度的節省了內存。
高程中還提到了動態原型模式,寄生構造函數模式,穩妥構造函數模式。