欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识！
您现在的位置是： 首页  >  IT编程

Javascript原型链的工作原理

程序员文章站 2022-07-02 17:58:15
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>

Javascript原型链的工作原理

上一篇： 仿大总点评浮动效果

下一篇： 两个都这么搞笑

推荐阅读