資源描述：
《js繼承的兩種方式》由會員上傳分享，免費在線閱讀，更多相關內容在行業(yè)資料-天天文庫。
1、Js的繼承實現(xiàn)方法Js的繼承在很多書里面細致的分了很多種類型和實現(xiàn)方式，大體上就是兩種：對象冒充、原型方式。這兩種方式各有優(yōu)點和缺陷，這里我先列舉出來，再從底層分析區(qū)別：1對象冒充functionA(name){this.name=name;this.sayHello=function(){alert(this.name+”sayHello!”);};}functionB(name,id){this.temp=A;this.temp(name);//相當于newA();deletethis.temp;//防止在以后通過temp引用覆蓋超類A的屬性和方法this.id=id;th
2、is.checkId=function(ID){alert(this.id==ID)};}當構造對象B的時候，調用temp相當于啟動A的構造函數(shù)，注意這里的上下文環(huán)境中的this對象是B的實例，所以在執(zhí)行A構造函數(shù)腳本時，所有A的變量和方法都會賦值給this所指的對象，即B的實例，這樣子就達到B繼承了A的屬性方法的目的。之后刪除臨時引用temp，是防止維護B中對A的類對象（注意不是實例對象）的引用更改，因為更改temp會直接導致類A（注意不是類A的對象）結構的變化。我們看到了，在Js版本更新的過程中，為了更方便的執(zhí)行這種上下文this的切換以達到繼承或者更加廣義的目的，增加了c
3、all和apply函數(shù)。它們的原理是一樣的，只是參數(shù)不同的版本罷了(一個可變任意參數(shù)，一個必須傳入數(shù)組作為參數(shù)集合)。這里就以call為例子，解釋一下用call實現(xiàn)的對象冒充繼承。functionRect(width,height){this.width=width;this.height=height;this.area=function(){returnthis.width*this.height;};}functionmyRect(width,height,name){Rect.call(this,width,height);this.name=name;this.sho
4、w=function(){alert(this.name+”witharea:”+this.area());}}關于Call方法，官方解釋：調用一個對象的一個方法，以另一個對象替換當前對象。call(thisOb,arg1,arg2…)這也是一種對象冒充的繼承，其實在call方法調用的時候發(fā)生的事情也是上下文環(huán)境變量this的替換，在myRect函數(shù)體中this肯定是指向類myRect對象的實例了，然而用這個this作為上下文環(huán)境變量調用名字叫Rect方法，即類Rect的構造函數(shù)。于是此時調用Rect時候對this的賦值屬性和方法都實際上是對一個myRect的對象進行。所以說盡
5、管call和apply并不是僅僅為了繼承而新增的方法，但用它們可以模擬繼承。對象冒充繼承就是這么一回事，它可以實現(xiàn)多重繼承，只要重復做這一套賦值的流程就可以了。不過目前真正大規(guī)模使用得并不多，為什么呢？因為它有一個明顯的性能缺陷，這就要說道OO的概念了，我們說對象是成員+成員方法的集合，構造對象實例的時候，這些實例只需要擁有各自的成員變量就可以了，成員方法只是一段對變量操作的可執(zhí)行文本區(qū)域而已，這段區(qū)域不用為每個實例而復制一份，所有的實例都可以共享?，F(xiàn)在回到Js利用對象冒充模擬的繼承里，所有的成員方法都是針對this而創(chuàng)建的，也就是所所有的實例都會擁有一份成員方法的副本，這是對
6、內存資源的一種極度浪費。其它的缺陷比如說對象冒充無法繼承prototype域的變量和方法就不用提了，筆者認為前一個致命缺陷就已經(jīng)足夠。不過，我們還是需要理解它，特別是父類的屬性和方法是如何繼承下來的原理，對于理解Js繼承很重要。1.1優(yōu)點1.可以實現(xiàn)多重繼承2.可以初始化繼承自父類的參數(shù)1.2缺點1.浪費內存資源，所有的實例都會擁有一份成員方法的副本。2原型方式第二種繼承方式是原型方式，所謂原型方式的繼承，是指利用了prototype或者說以某種方式覆蓋了prototype，從而達到屬性方法復制的目的。其實現(xiàn)方式有很多中，可能不同框架多少會有一點區(qū)別，但是我們把握住原理，就不會
7、有任何不理解的地方了。看一個例子（某一種實現(xiàn)）：functionPerson(){this.name=“Mike”;this.sayGoodbye=function(){alert(“GoodBye!”);};}Person.prototype.sayHello=function(){alert(”Hello!”);};functionStudent(){}Student.prototype=newPerson();關鍵是對最后一句Student原型屬性賦值為Person類構造的對象，這里筆
