美文网首页
JS 中继承的写法

JS 中继承的写法

作者: 小废柴JH | 来源:发表于2019-07-20 09:49 被阅读0次

    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 中继承的写法

          本文链接:https://www.haomeiwen.com/subject/xxmelctx.html