每個JavaScript函數都有prototype屬性(javascript對象沒有這個屬性),這個屬性引用了一個對象,這個對象就是原型對象。javascript允許我們修改這個原型對象。
修改有2種方式:
方式1:在原有的原型對象上增加屬性或者方法
function Person() { } Person.prototype.add = function(){ alert(this.name); }; Person.prototype.name = "aty"; var p1 = new Person(); p1.add();//aty
方式2:重寫(覆蓋)原型對象
function Person() { } Person.prototype = { add : function(){ alert(this.name); }, name : "aty" } var p2 = new Person(); p2.add();//aty
可以看到上面這2種方式都可以修改原型,那他們的差別究竟是什麼呢?到底哪種方式才是推薦的的做法呢?
function Person() { } function Animal() { } var person = new Person(); var animal = new Animal(); // 修改原型 Person.prototype.say = function(){ alert("person"); } // 修改原型 Animal.prototype = { say : function(){ alert("person"); } } person.say();//person animal.say();//Uncaught TypeError: undefined is not a function
如果是先創建對象,然後再修改原型,那麼如果采用方式1,已經創建的對象能夠正確訪問修改後的原型;如果采用方式2,已經創建的對象無法訪問到修改後的原型。從這個角度來看,顯然方式1比方式2更好。為什麼會這樣呢?
function Person() { } function Animal() { } var person = new Person(); var animal = new Animal(); alert(person.__proto__ === Person.prototype);//true alert(animal.__proto__ === Animal.prototype);//true // 修改原型 Person.prototype.say = function(){ alert("person"); } // 修改原型 Animal.prototype = { say : function(){ alert("person"); } } alert(person.__proto__ === Person.prototype);//true alert(animal.__proto__ === Animal.prototype);//false
很顯然這與java中"修改引用"和"修改引用指向的對象"很相似,效果也是一樣的。
以上這篇關於javascript原型的修改與重寫(覆蓋)差別詳解就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持。