js原生继承之——类式继承实例(推荐使用)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>classInherit</title>
    <script type="text/javascript">
    //声明父类
    function superClass(){
        this.name = 'Lucy';
    }
    superClass.prototype.getName = function(){
        console.log(this.name);
    }
    //声明子类
    function subClass(){
        this.subname = 'Lilei';
        this.books = ['html','css','js'];
    }
    //类式继承
    subClass.prototype = new superClass();
    //注:一定要先继承,再添加子类原型方法,否则子类的实例调用子类原型方法时会报错:function is not defined
    subClass.prototype.getSubName = function(){
        console.log(this.subname);
    }
    //将子类的prototype原型constructor属性的指向修正为subClass子类,否则继承后默认指向了父类的原型上,会出问题
    subClass.prototype.constructor = subClass;
    //实例化对象测试
    var test1 = new subClass();
    var test2 = new subClass();
    console.log(test1.name);       //Lucy
    console.log(test1.subname);    //Lilei
    test1.getName();               //Lucy
    test1.getSubName();            //Lilei
    // console.log(test1.books);
    test1.books.push('php');
    console.log(test1.books);   //输出:["html", "css", "js", "php"]
    console.log(test2.books);   //输出:["html", "css", "js"]
                                // 两个实例之间不会影响
    //本例已经通过验证
    </script>
</head>
<body>
    
</body>
</html>

原文地址:https://www.cnblogs.com/koleyang/p/4916588.html