Javascript原型鏈的工作原理

Javascript原型鏈的工作原理解析案例

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>prototype clone</title>
    </head>
    <body>
        <script>
            var baseClass=function(){
                  this.name="baseClass:name--->baseClass";
                  this.showMsg = function(){
                     console.log("baseClass::showMsg");   
                  }
                }
 
            var extendClass=function(){
                this.age="extendClass:age--->20";
                this.showMsg=function(){
                     console.log("extendClass::showMsg");   
                };
            }
 
            /*baseClass類為extendClass類的原型,extendClass可以使用所有的原型的方法,
             * 實現功能和屬性擴展(類似java裡面的繼承)如果方法名一致,js引擎掃描從自身掃描開始,
             *如果掃描到則不進行向下掃描(原型鏈工作原理)
              * */
            extendClass.prototype = new baseClass();
            var instance = new extendClass();
            instance.showMsg(); // 顯示baseClass::showMsg
            console.log(instance.name)
            console.log(instance.age)
        </script>
    </body>
</html>

這裡寫圖片描述

發佈留言