JS 中继承的写法

es5:

function Human(name){
  this.name = name
}

Human.prototype.move = function(){}

function Man(name){
  Human.call(this, name)
  this.gender = '男'
}

Man.prototype.__proto__ === Human.prototype // 兼容性有问题
// 解决方案
var f = function(){}
f.prototype = Human.prototype 
Man.prototype = new f()  

Man.prototype.fight = function(){}

es6: class

class Human {
  constructor(name) {
    this.name = name
  }
  move() {
    console.log('动')
  }
}

class Man extends Human {
  constructor() {
    super()
    this.gender = '男'
  }
  fight() {
    console.log('吃我一拳')
  }
}

在原型上声明一个不是函数的属性:
es5:Human.prototype.race = '人类'
es6:

class Human {
  constructor(name) {
    this.name = name
  }
 race: '人类' // 不支持这样写法,会报语法错误
}
// 变通写法,
class Human {
  constructor(name) {
    this.name = name
  }
  get race(){
    return '人类'
  }
}

总结:
es5的写法稍微复杂一点,但是理解起来简单,看起来更舒服。而es6写法简单,但是更加抽象。
假设把Object和Aaary看作一个类,那么Object和Aaary有什么关系吗?答案是没有。但是Object的prototype和Aaary的prototype有一个关系,那就是JS里面有一个重要的原则,就是所有的类,所有的对象都是从new Object构造出来的。
在JS中继承的实质就是两次的原型链搜索。

你可能感兴趣的:(JS 中继承的写法)