JS prototype chain

[xxleyi]

代码主体来自同事大桃，我做了一些修改。😄😄😄

// 定义Person构造函数
function Person (name) {
    this.name = name
    this.sayHello = function(){
        console.log('hello from person')
    }
}

Person.prototype = new Person()
Person.prototype.constructor = Person
Person.prototype.sayName = function(){
    console.log(this.name)
}

// 定义Teacher构造函数
function Teacher (name,level){
    this.name = name
    this.level = level
}
Teacher.prototype = new Person()
Teacher.prototype.constructor = Teacher
Teacher.prototype.sayLevel = function(){
    console.log(this.level)
}

// 定义MathTeacher构造函数
function MathTeacher(name, level, className){
    this.name = name
    this.level = level
    this.className = className
}
MathTeacher.prototype = new Teacher()
MathTeacher.prototype.constructor = MathTeacher
MathTeacher.prototype.sayClassName = function (){
    console.log(this.className)
}

let liSi = new Person('Li Si')
let wangLaoShi = new Teacher('Wang Wu','Normal')
let zhangLaoShi = new MathTeacher('Zhang San','Great', 'Math')

console.log(liSi.hasOwnProperty("sayHello"))
console.log(wangLaoShi.hasOwnProperty("sayHello"))
console.log(zhangLaoShi.hasOwnProperty("sayHello"))

liSi.sayHello()
wangLaoShi.sayHello()
zhangLaoShi.sayHello()

liSi.sayName()
wangLaoShi.sayName()
zhangLaoShi.sayName()

wangLaoShi.sayLevel()
zhangLaoShi.sayLevel()

zhangLaoShi.sayClassName()

JS Tutor 演示

[xxleyi]

one clearer version:

// 定义Person构造函数
function Person (name) {
    this.name = name
    this.sayHello = function(){
        console.log('hello from person')
    }
}

Person.prototype = new Person()
Person.prototype.constructor = Person
Person.prototype.sayName = function(){
    console.log(this.name)
}

// 定义Teacher构造函数
function Teacher (name,level){
    this.name = name
    this.level = level
}
// Teacher.prototype = new Person()
// Teacher.prototype.constructor = Teacher
Teacher.prototype = new Teacher()
Teacher.prototype.__proto__ = Person.prototype
Teacher.prototype.constructor = Teacher
Teacher.prototype.sayLevel = function(){
    console.log(this.level)
}

// 定义MathTeacher构造函数
function MathTeacher(name, level, className){
    this.name = name
    this.level = level
    this.className = className
}
// MathTeacher.prototype = new Teacher()
// MathTeacher.prototype.constructor = MathTeacher
MathTeacher.prototype = new MathTeacher()
MathTeacher.prototype.__proto__ = Teacher.prototype
MathTeacher.prototype.constructor = MathTeacher
MathTeacher.prototype.sayClassName = function (){
    console.log(this.className)
}

let liSi = new Person('Li Si')
let wangLaoShi = new Teacher('Wang Wu','Normal')
let zhangLaoShi = new MathTeacher('Zhang San','Great', 'Math')

console.log(liSi.hasOwnProperty("sayHello"))
console.log(wangLaoShi.hasOwnProperty("sayHello"))
console.log(zhangLaoShi.hasOwnProperty("sayHello"))

liSi.sayHello()
wangLaoShi.sayHello()
zhangLaoShi.sayHello()

liSi.sayName()
wangLaoShi.sayName()
zhangLaoShi.sayName()

wangLaoShi.sayLevel()
zhangLaoShi.sayLevel()

zhangLaoShi.sayClassName()

JS Tutor 演示