1. <!DOCTYPE html>
    2. <html lang="en">
    4. <head>
    5.     <meta charset="UTF-8">
    6.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
    7.     <title>构造函数继承</title>
    8. </head>
    10. <body>
    12. </body>
    14. </html>
    15. <script>
    16.     /**
    17.      *  优点:
    18.      *      创建的子类,可以向父类传参
    19.      *  缺点:
    20.      *      每个实例都拷贝一份,占内存大
    21.      *      只能继承父类构造函数的属性和方法,不能继承父类原型上的属性和方法;
    22.      */
    23.     function Person(id) {
    24.         this.id = id || 'id not';
    25.         this.fun = function(id){
    26.             return `只能继承原型上的属性和方法 - ${id}`;
    27.         }
    29.         //  原型上的属性和方法
    30.         Person.prototype = {
    31.             value: '不能继承原型上的属性和方法',
    32.             get() {
    33.                 console.log('penson get');
    34.             }
    35.         }
    36.     }
    38.     function Adult(id) {
    39.         this.type = '子类';
    41.         //  给父类传参
    42.         Person.call(this, id)
    43.     }
    45.     //  给父类传参
    46.     const adult = new Adult('前端伪大叔');
    47.     console.log(adult); //  __proto__: Object   没有继承 Person原型~ 直接找到了 Object原型上
    49.     //  调用父类的属性和方法
    50.     console.log(adult.id);
    51.     console.log(adult.fun('id'));
    53.     // 因为只是实现了构造函数继承,所有无法使用原型上的属性和方法
    54.     console.log(adult.value);   //  undefined
    55.     console.log(adult.get());   // Uncaught TypeError: adult.get is not a function
    56. </script>