JS函數(shù)進階之繼承用法實例分析

更新時間：2020年01月15日 11:08:35 作者：qq_42412646

這篇文章主要介紹了JS函數(shù)進階之繼承用法,結(jié)合實例形式分析了JavaScript函數(shù)繼承相關(guān)定義與使用操作技巧,需要的朋友可以參考下

本文實例講述了JS函數(shù)進階之繼承用法。分享給大家供大家參考，具體如下：

直接代碼，不解釋：

<html>
    <head>
        <title>js函數(shù)繼承進階</title>
        <meta charset="UTF-8"/>
        <script type="text/javascript">
            function person(name,age){  //對象的創(chuàng)建
                this.name=name;
                this.age=age;
//                this.test=function(a){
//                    console.log("能運行嗎");
//                }
            }
            function book(name){
                this.name="是我嗎";
                this.lookat=function(a){
                    console.log("看看能行嗎");
                }
            }
            function czxt(name){
                this.name=name;
            }
            person.prototype.read=function(a){console.log("I can read");};
            book.prototype.sign=function(a){console.log("I am book"); return new book()};    //視其為一個對象的一個屬性進行”繼承“
            person.prototype.book=new book();               //直接進行“包含”
//            person.prototype=new book();
            czxt.prototype.appear=function(a){console.log("我是操作系統(tǒng)")};
            book.prototype.subject=new czxt();
//            book.prototype=new czxt();
            var p1=new person("張三",37);
//            p1.lookat();    //類內(nèi)部的方法也可以調(diào)用
//            console.log(p1.name);   //包含類和父類都含有，是父類的name屬性值。  "張三"
            console.log(p1.book.name); //用屬性進行調(diào)用的話，是包含類的name屬性   ”是我嗎“
//            p1.sign();     //直接調(diào)用包含函數(shù)方法
//            p1.book.sign();   //調(diào)用對象屬性包含的方法
//            p1.read();     //調(diào)用公共對象外函數(shù)
//            p1.test();    //函數(shù)調(diào)用函數(shù)內(nèi)部的函數(shù)（視函數(shù)為對象）
//            p1.address="山東"; //每個特定對象主動添加對象屬性
//            console.log(p1.address);
            var b1=new book();
//            b1.appear();   //調(diào)用其繼承體內(nèi)的函數(shù)
//            p1.appear();   //無法調(diào)用包含對象內(nèi)的包含方法（無法直接調(diào)用孫子函數(shù)）
//            p1.book.appear();  //用屬性調(diào)用也不行啊，不是函數(shù)可還行
//            p1.book.subject.appear(); //雙重屬性定義可以，牛逼了。
//            p1.sign().appear();  //person非屬性調(diào)用book，在book的sign方法中添加一個book類型的返回值以此來調(diào)用book包含的方法。
        </script>
    </head>
    <body>
        <h3>js函數(shù)繼承進階</h3>
    </body>
</html>

運行結(jié)果：

進一步理解，引入prototype，一方面是實現(xiàn)了同一個類創(chuàng)建對象時創(chuàng)建實現(xiàn)相同功能的方法，這些方法在對象創(chuàng)建時同樣會占用內(nèi)存，所以我們把方法定義到外面變成公共的方法，節(jié)省了內(nèi)存（注：如果是類內(nèi)部的方法構(gòu)建兩個對象時其內(nèi)部的函數(shù)時不同的，不相等且不等同）另一方面，降低了代碼的冗余，其中當你把一個類的prototype值設(shè)置為一個對象，那么你就擁有了其內(nèi)部的屬性和方法，當進行包含后可以直接利用帶屬性調(diào)用或者直接調(diào)用，這樣有一個好處是：我們沒有必要創(chuàng)建這個對象就可以直接調(diào)用其內(nèi)部的方法。但是對于三層的包含關(guān)系，我們不能使用，要想使用就只能用連續(xù)雙重的屬性調(diào)用。對于內(nèi)部屬性值如果子類和父類的屬性名相同，那么直接調(diào)用就是父類的屬性，利用屬性調(diào)用包含類可以調(diào)用子類的屬性。

感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運行工具：http://tools.jb51.net/code/HtmlJsRun測試上述代碼運行效果。

更多關(guān)于JavaScript相關(guān)內(nèi)容可查看本站專題：《JavaScript常用函數(shù)技巧匯總》、《javascript面向?qū)ο笕腴T教程》、《JavaScript查找算法技巧總結(jié)》、《JavaScript錯誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》及《JavaScript數(shù)學運算用法總結(jié)》

希望本文所述對大家JavaScript程序設(shè)計有所幫助。

您可能感興趣的文章: