专栏首页木子昭的博客Javascript实现完美继承实现javascript完美继承要考虑三个方面:

Javascript实现完美继承实现javascript完美继承要考虑三个方面:

实现javascript完美继承要考虑三个方面:

第一步: 获取父构造函数体内的属性

  • 解决方法: 通过 Father.call(this)实现(这里的this是子构造函数)

第二步: 根据父构造函数原型 创建独立的子构造函数原型, 且要求子构造函数原型的__proto__属性指向子构造函数

  • 解决方法: Son.prototype = Object.create(Father.prototype)

第三步: 将子构造函数原型constractor指向子构造函数

  • 解决方法 Son.prototype.constractor = Son
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>完美继承</title>

    <script>

        function Father(name){
            this.name = name;
        }
        Father.prototype.sayName = function(){

          console.log(this.name)

        };
        
        function Son(name, age){
            // 第一步: 获取父构造函数函数体内的属性
            Father.call(this, name)

        }
        
        // 第二步: 根据父构造函数原型 创建独立的子构造函数原型, 且要求子构造函数原型的__proto__属性指向子构造函数
        Son.prototype = Object.create(Father.prototype);
        // 第三步: 将子构造函数原型的constractor指向子构造函数
        Son.prototype.constructor = Son;

        son1 = new Son("小明", 13);

        console.log("子对象的原型指向子构造函数:",son1.__proto__ === Son.prototype);
        console.log("子对象的原型指向父构造函数:",son1.__proto__ === Father.prototype);
        console.log("打印子对象", son1);


        son2 = new Son("小红", 14);

        console.log("打印两个子对象的属性",son1, son2);

        son1.sayName();
        son2.sayName();

        // 重新父原型内的方法 ,观察是否会对父原型产生影响

        Son.prototype.sayName = function(){

            console.log("子原型函数sayName", this.name);

        };

        // 父实例对象调用sayName
        father1 = new Father("老王");
        father1.sayName();


        // 子实例调用sayName
        son1.sayName();
        son2.sayName();




    </script>


</head>
<body>


</body>
</html>

小结

  • 第一步(为了获取父构造函数函数体内的属性): 用子构造函数this, 去执行父构造函数, 最终使父构造函数的属性被附加到了子构造函数this上.
  • 第二步(为了完美获取父构造函数原型): 要理解b = Object.create(a),创建出实例a的__proto__依然是指向a的, 即b.__proto__ === a
  • 第三步(为了使子构造函数的实例能正确指向子构造函数): 很类似双向链表中替换单个节点的操作.

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 将Django部署到Centos7全攻略

    Django部署到Cenos7需要安装大量的依赖包, 有很多坑需要踩, 这里是踩坑后探索出的标准化步骤

    zhaoolee
  • 获取免费https认证 详解certbot使用步骤

    对配置子域名有疑问的, 可以查看我之前写过的nginx配置二级域名

    zhaoolee
  • 模拟Vue数据的双向绑定

    Vue的数据双向绑定功能一直为人称道, Vue数据的双向数据绑定主要依赖了Object.defineProperty,这里尝试用最简单的代码, 实现数据的双向...

    zhaoolee
  • C#类学习-3

    只要使用 new 运算符实例化对象,并且不为 new 提供任何参数,就会调用默认构造函数。

    用户2398817
  • C#-构造函数

    创建一个类的时候,使用new运算符对类进行实例化。在为新对象分配内存之后,new运算符立即调用构造函数。

    祝你万事顺利
  • 构造函数浅析

    构造函数浅析<?xml:namespace prefix = o ns = "urn:schemas-microsoft-com:office:office" ...

    ternturing
  • C#基础知识系列五(构造函数)

      2、不带参数的构造函数称为“默认构造函数”。 无论何时,只要使用 new 运算符实例化对象,并且不为 new 提供任何参数,就会调用默认构造函数。除非类是s...

    aehyok
  • 关于构造函数与析构函数的分享

    创建复杂的类类型的对象时,可能需要对一些数据或者对象中需要使用的资源进行一些初始化操作,比如设置成员的默认值,打开数据库,打开文件,等等,而这些准备工作,就可以...

    用户7053485
  • C++终结类

    C++如何实现不能被继承的类,即终结类。Java中有final关键字修饰,C#中有sealed关键字修饰,C++11之前还没有类似的关键字来修饰类实现终结类,需...

    Dabelv
  • 19.Swift学习之构造函数与析构函数

    YungFan

扫码关注云+社区

领取腾讯云代金券