原型继承(持续更新中...)

所谓的继承,本质上就是将子类的__proto__指向父类的prototype,我更倾向于叫它委托,因为父类并没有把自身的属性复制给子类,而只是给了子类使用的权限。子类调用父类的方法时,本质上还是通过查找原型链的方式进行调用。

当使用create方法创建对象时,也要注意

const obj = {
      a: 2
    }
 const b = Object.create(obj) // 原理:把b的原型指向obj

一、原型继承:

function Foo (name) {
      this.name = name;
    };
    Foo.prototype.myName = function () {
      return this.name;
    };
    function Bar (name, label) {
      Foo.call(this, name);
      this.label = label;
    };
    Bar.prototype =  Object.create(Foo.prototype);
    const bar = new Bar('xiaoming', 'haoshuai');
    Bar.prototype.myLabel = function () {
      return this.label
    }

提示:为什么不用 Bar.prototype = Foo.prototype,因为此时 Bar.prototype是对 Foo.prototype的引用,
当执行类似

Bar.prototype.myLabel = function () {
      return this.label
    }

的赋值语句时,会直接修改Foo.prototype对象本身,显然这不是想要的继承结果,否则直接使用Foo就可以了,根本不需要Bar对象。
这样做的唯一缺点就是需要创建一个新的对象然后把旧对象抛弃掉。

二、ES6之前,可以用__proto__方法来实现一个可靠并且标准的继承

function Foo (name) {
      this.name = name;
    };
    Foo.prototype.myName = function () {
      return this.name;
    };
    function Bar (name, label) {
      Foo.call(this, name);
      this.label = label;
    };
    Bar.prototype.__proto__ = Foo.prototype;
    const b = new Bar('小明', '小矮子');
    Bar.prototype.myLabel = function () {
      return this.label;
    }
    console.log(Bar.prototype); // Foo {myLabel: ƒ, constructor: ƒ}
    console.log(Foo.prototype); // {myName: ƒ, constructor: ƒ}

三、ES6的方法

Object.setPrototypeOf(Bar.prototype, Foo.prototype)

这种方式方法更短,可读性更高

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值