一、仔細分析前面的原型模式創建對象的方法,發現原型模式創建對象,也存在一些問題,如下:
1、它省略了為構造函數傳遞初始化參數這個環節,結果所有實例在默認的情況下都將取得相同的屬性值,這還不是最大的問題!
2、最大的問題是原型中的所有屬性是被很多實例所共享的,這種共享對于函數非常合適,對于那些包含基本值的屬性也說得過去,因為我們知道可以在實例上添加一個同名屬性,可以隱藏原型中的對應屬性。但是對于包含應用類型值的屬性來說,問題就非常嚴重了,代碼如下:
function Person(){ } Person.prototype={constructor:Person,name:"張三",age:22,job:"coder",friends:["李四","王五"],sayName:function(){alert(this.name);} } var person1=new Person(); var person2=new Person();person1.friends.push("趙六");alert(person1.friends); //輸出:李四,王五,趙六alert(person2.friends);//輸出:李四,王五,趙六
分析上面的代碼,當我們為person1添加一個朋友的時候,發現person2同時也被添加了一個朋友,但這并不是我們想要的,而這正是因為原型模式的共享的本性所導致的,只要任何一個實例修改了原型屬性對象中的屬性值,所有與該原型對象關聯的實例都會受到影響!
?
二、組合使用構造函數模式和原型模式
為了解決原型模式不能初始化參數和共享對于引用模式所存在的問題!這里我們可以采用構造函數模式和原型模式的結合模式來創建自定義類型,構造函數用于與解決初始化參數(實例屬性的定義),原型模式用于共享? 方法和constructor。
這種構造函數與原型組合的模式創建自定義類型,是ECMAScript中使用最廣泛、認同度最高的一種創建自定義類型的方法。可以說,這是用來定義引用類型的一種默認模式。
代碼如下:
?
function Person(name,age,job){this.name=name;this.age=age;this.job=job;this.friends=["小超","大超"];}Person.prototype={constructor:Person,sayName:function(){alert(this.name);}}var person1=new Person("張三",22,"coder");var person2=new Person("李四",22,"coder");person1.friends.push("Stephen Curry","Kevin Durant");alert(person1.friends); //輸出:小超,大超,Stephen Curry,Kevin Durantalert(person2.friends);//輸出:小超,大超
?
通過上面的輸出我們發現組合使用構造函數模式和原型模式創建的自定義類型及解決了
1、構造函數:構造函數創建類型相同的函數,確是不同的作用域鏈和標識符解析(因為在JS中每創建一個函數就是一個對象,所以? (導致了構造函數中的方法)? 在不同的實例中都需要重新創建一遍,但是這些方法做的確實同一件事情);
2、原型模式:其不能初始化參數,以及它的共享性對與一些引用類型所造成的影響(比如數組);
?