首頁 > 開發者 > JavaScript
JS中通過call方法實現繼承
講解都寫在注釋裡面了，有不對的地方請拍磚，謝謝！ 複製代碼<html xmlns="http://www.w3.org/1999/xhtml"><head> <title>JS通過call方法實現繼承</title></head><body> <script type="text/javascript"> /* js中的繼承有多種實現方式，今天我們討論下通過call方法實現的繼承。 此方法與 原型鏈繼承 相比還是比較簡單，容易理解的。 那麼，我們先對call方法進行簡單的講解： call 方法可以用一個對象來代替另一個對象調用一個方法。 這句話蠻不好理解， 還是看範例程式碼吧，更直觀明了： */ function a() { this.name = "我是a"; this.showName = function () { alert(this.name); } } function b() { this.name = "我是b"; } var _a = new a(); var _b = new b(); //下面這行代碼的意思是：用 _b 來代替 _a 執行 _a 的showName方法。 //因此執行對象從 _a 變成了 _b, showName方法裡面的this此時指代的是 b 了，而不是 a //因此輸出結果為： 我是b _a.showName.call(_b); /* 哎，語文沒學好，總感覺表達不清楚，也不知道大家能不能看懂。 好了，進入正題，我們來看繼承的實現。 */ /* 首先我們要定義4個類：動物(animal) ; 人(person) ; 中國人(chinese) ; 日本人(japanese)。 代碼如下: */ function animal() { this.eat = function () { alert("動物都要吃東西"); } } function person() { this.say = function () { alert("人是會說話的"); } } // function chinese() {// this.ch = function () {// alert("我是中國人");// }// } // function japanese() {// this.ja = function () {// alert("我是日本人");// }// } /* 然後實現4個類之間的關係 關係如下： 中國人 繼承自 人 日本人 繼承自 動物 和 人 說明： 在JS中是可以實作類別的多繼承的。 因此 japanese 可以同時繼承自 animal 和 person , 它不像C#和java語言，只支援介面的多繼承，而不支援類的多繼承。 修改上面的chinese和japanese如下： */ function chinese() { person.call(this); //繼承自 person 類 （用chinese來代替person） this.ch = function () { alert("我是中國人"); } } function japanese() { animal.call(this); //繼承自 animal 類 person.call(this); //繼承自 person 類 this.ja = function () { alert("我是日本人"); } } /* 我們知道：實現繼承後，子類是可以擁有父類的公有欄位和方法的。 而父類不會擁有子類的任何東西 說明： js中的 欄位，方法 也是有公有和私人之分的。 子類只能訪問到父類的公有欄位和方法。 關於 js 中的 公有，私人，全域，靜態 等等的定義講解我會另寫一篇博文 與大家討論。 請看如下代碼： */ //執行個體化對象 var c = new chinese(); var j = new japanese(); var p = new person(); c.say(); //擁有父類 person 的 say 方法 c.ch(); //自身的 ch 方法 j.eat(); //擁有父類 animal 的 eat 方法 j.say(); //擁有父類 person 的 say 方法 j.ja(); //自身的 ja 方法 p.say(); //自身的 say 方法 /* 下面兩句會報錯， 因為父類person是不會擁有子類的任何東西的， 所以p沒有ch和ja方法。 p.ch(); p.ja(); */ </script></body></html>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
