2021-01-07

最新推荐文章于 2024-11-08 16:09:18 发布

于慨

最新推荐文章于 2024-11-08 16:09:18 发布

阅读量265

点赞数 2

分类专栏：红宝书文章标签： javascript

本文链接：https://blog.csdn.net/ike_yu/article/details/112299210

版权

红宝书专栏收录该内容

17 篇文章 0 订阅

订阅专栏

本文通过示例展示了JavaScript中的继承机制，通过`SuperType.call(this)`实现子类`SubType`对父类`SuperType`的继承。子类实例化后不仅拥有父类的属性，如`colors`数组，而且对子类属性的操作不会影响父类的同名属性，即使这些属性包含引用值。这体现了JavaScript中继承的特性及其安全性。

摘要由CSDN通过智能技术生成

【红宝书p243继承之盗用父类构造函数】

1，查看继承后，子类父类的结构

<script>
        function SuperType() {
            this.colors = ["red", "blue", "green"];
        }
        function SubType() {
            // 继承 SuperType
            SuperType.call(this);
        }
        console.dir(SuperType);
        console.dir(SubType);
    </script>

在这里插入图片描述

2，查看子类实例、父类实例的结构

 <script>
        function SuperType() {
            this.colors = ["red", "blue", "green"];
        }
        function SubType() {
            // 继承 SuperType
            SuperType.call(this);
        }
        let sup = new SuperType();
        let sub = new SubType();
        console.dir(sup);
        console.dir(sub);
    </script>

在这里插入图片描述
以上看出，子类实例化后拥有父类的属性

<script>
        function SuperType() {
            this.colors = ["red", "blue", "green"];
        }
        function SubType() {
            // 继承 SuperType
            SuperType.call(this);
        }
        let sup = new SuperType();
        let sub = new SubType();
        // 往子类实例的colors属性数组中添加元素
        sub.colors.push('black');
        console.dir(sup);
        console.dir(sub);
    </script>

在这里插入图片描述
以上看出，子类继承了父类属性，但对子类属性的操作，不会影响父类的属性，即使父类属性存在引用值的情况