深入学习原型继承概念-前端ABC

<!DOCTYPE html>  
<html lang="en">  
<head>  
    <meta charset="UTF-8">  
    <title>qdabc.cn</title>  
</head>  
<body>  
    <script>  
        // js中怎么实现继承：通过原型链的概念  
  
        // 构造函数  原型对象  实例对象 三者之间的关系  
        /*  
         1.构造函数.prototype = 原型对象  
         2.原型对象.constructor = 构造函数(模板)  
         3.原型对象.isPrototypeOf(实例对象)  判断实例对象的原型是不是  当前对象  
         4.构造函数 和  实例对象 (类和实例)  
        */  
  
        // 父类 构造函数 sup  
  
        function Sup(name){  
            this.name = name;  
        }  
  
        // 父类原型对象  
        Sup.prototype = {  
            constructor:Sup,  
            sayName:function(){  
                alert(this.name)  
            }  
        }  
        // 子类构造函数  
        function Son(age){  
            this.age = age;  
        }  
  
        // 如果我们让子类的原型对象变为父类的实例化对象 将会发生什么？  
        /*  
            1.此时的原型对象包含一个指向另一个原型的指针  
            Sup 的实例对象 和 原型对象有一个 isPrototypeOf 的关系  
            2.相应的另一个原型中也包含着指向另一个构造函数的指针  
            子类的原型对象的构造器（模板）变成了父类的构造器  
  
            以此实现继承  
        */  
        // alert(Son.prototype.constructor)  
        Son.prototype = new Sup("小张");  
        // alert(Son.prototype.constructor)  
        var son1 = new Son();  
        alert(son1.name)//实现继承  
        son1.sayName();  
  
  
    </script>  
</body>  
</html>
欢迎分享本文，转载请保留出处：前端ABC » 深入学习原型继承概念
深入学习原型继承概念

相关推荐

发表评论 0
