检验 es6 的 class 属性的继承问题

目录

• 检验 class 继承问题
• 结论：class 继承来的属性有下列几个特征

检验 class 继承问题

本文乃是随记，不考虑易读性和排版问题

条件：定义两个 构造函数 Persons 和 Son ，Son 属性继承自 Persons，Son 的原型方法 hello 继承自 Persons 。

目的：

1. Persons 改变原型方法 hello()，判断 Son 继承来的 hello() 方法是否会改变
2. Son 改变继承方法 hello()，判断父构造函数的原型方法 hello() 是否会改变

// 父构造函数
class Persons {
    constructor() {} 
  hello() {
    console.log('Person 方法未改变')
  }
}

var a = new Persons()  // 检测构造函数 Persons 是否创建成功
a.hello()

// 子构造函数
class Son extends Persons {
    constructor(){
        super()
        
    }
    word() {
        console.log("新构造函数")
    }
}

var b = new Son()  // 检验构造函数 Son 是否创建成功
b.hello()
b.word()

Persons.prototype.hello = function() {  // 改变 Persons 的构造函数的原型方法
    console.log("父构构造函数的原型方法已改变，打印表示同时改变了子构造函数的原型方法")
}

var d = new Son()   // 查看父构造函数的原型改变，子构造函数原型是否改变
d.hello();

Son.prototype.hello = function() {
    console.log("改变 Son 构造函数的原型，看看会不会改变 Persons 构造函数的原型，与上面的一样，表示子构造函数原型改变，不影响父构造函数原型")
}

var e = new Persons()  // 看看子构造函数的原型 改变，父构造函数的原型会不会改变，与上面打印的一样，表示子构造函数原型改变，不影响父构造函数原型
e.hello()     

打印结果：

Person 方法未改变
Person 方法未改变
新构造函数
父构构造函数的原型方法已改变，打印表示同时改变了子构造函数的原型方法
父构构造函数的原型方法已改变，打印表示同时改变了子构造函数的原型方法

结论：class 继承来的属性有下列几个特征

1. 改变 子构造函数原型，不改变父构造函数原型
2. 改变 父构造函数原型，改变子构造函数原型

Tip：本文若存在错误，欢迎各位大佬留言提出，谢谢~~