检验 es6 的 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:本文若存在错误,欢迎各位大佬留言提出,谢谢~~

猜你喜欢

转载自www.cnblogs.com/mhxs/p/10953931.html