實現(xiàn)JavaScript編寫類的方式有哪些

這篇文章將為大家詳細講解有關實現(xiàn)JavaScript編寫類的方式有哪些，文章內(nèi)容質(zhì)量較高，因此小編分享給大家做個參考，希望大家閱讀完這篇文章后對相關知識有一定的了解。

網(wǎng)上實現(xiàn)javascript寫類的方法有很多, 總結下不外乎以下幾種. 我自己學習總結了一下.

構造方法方式；原型方式；構造方法+原型的混合方式

現(xiàn)在具體分析一下以上方式的優(yōu)缺點:

構造方法方式

這是最基本的也是最像Java寫class的方式. 上代碼:

//創(chuàng)建一個Student類   function Student(name){        this.name = name;        this.sayName = function(){            alert(this.name);        };   }   //new兩個不同的Student.   var jimmy = new Student('jimmy');   var henry = new Student('henry');   jimmy.sayName();//顯示jimmy   henry.sayName();//顯示henry

這樣的方法簡單明了, 也符合JAVAer的胃口, 但是每new一個新對象, 就會在內(nèi)存中分配一個sayName方法, 性能不是很好.

原型方式

//創(chuàng)建一個Student類   //屬性和方法都通過Student.prototype設置   function Student(name){       Student.prototype = name;       Student.prototype.sayName = function(){           alert(this.name);       }   }   //new兩個不同的Student.   var jimmy = new Student('jimmy');   var henry = new Student('henry');   jimmy.sayName();//顯示henry!!!   henry.sayName();//顯示henry!!!

也許執(zhí)行的代碼和有些童鞋的期望有出入. 兩次alert都彈出henry! 其實很好理解. 屬性和方法都通過prototype設置. 不同對象的同一個屬性或者方法都指向同一個內(nèi)存, 所以henry是在jimmy后設置的. 所以henry把jimmy覆蓋了.

混合方式

構造方法的方式可以為同一個類的每一個對象分配不同的內(nèi)存, 這很適合寫類的時候設置屬性, 但是設置方法的時候我們就需要讓同一個類的不同對象共享同一個內(nèi)存了. 寫方法用原型的方式***. 所以寫類的時候需要把構造方法和原型兩種方式混合著用. 廢話少說, 看代碼:

//創(chuàng)建一個Student類   //屬性通過構造方法設置   //方法通過Student.prototype設置   function Student(name){       this.name = name;       Student.prototype.sayName = function(){           alert(this.name);       }   }   //new兩個不同的Student.   var jimmy = new Student('jimmy');   var henry = new Student('henry');   jimmy.sayName();//顯示jimmy   henry.sayName();//顯示henry

so far so good. 同一類的不同對象, 屬性各自占有內(nèi)存, 方法共享同一內(nèi)存. 其實這里還是有一個小問題:

每new一個新對象, 就會執(zhí)行一次

Student.prototype.sayName = function(){       alert(this.name);  }

造成不必要的重復運算. 可以在類里面設置一個標記位, 第一次執(zhí)行的時候給這個標志位設置true, 如果為true就不再為prototype設置方法。

關于實現(xiàn)JavaScript編寫類的方式有哪些就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，可以學到更多知識。如果覺得文章不錯，可以把它分享出去讓更多的人看到。