JavaScript中借用构造函数实现继承

核心思想:使用.call()和.apply()将父类构造函数引入子类函数,也就是在子类构造中调用父类构造同时使用this实现继承,用父类的构造函数来增强子类实例,等同于复制父类的实例给子类

注:.call()和.apply()作用是一样的,唯一的区别就是传参的时候,call 需要把参数按顺序传递进去,而 apply 则是把参数放在数组里

操作方式:

  1. 定义父类型构造函数

  2. 定义子类型的构造函数

  3. 给子类型的原型添加方法

  4. 创建子类型的对象然后调用

    // 定义父类型构造函数
    function SuperType(name) {
        this.name = name;
        this.showSupperName = function () {
            console.log(this.name);
        };
    }
    
    // 定义子类型的构造函数
    function SubType(name, brother) {
        // 在子类型中调用call方法继承自SuperType
        //this指代的是上下文
        SuperType.call(this, name);
        this.brother= brother;
    }
    
    // 给子类型的原型添加方法
    SubType.prototype.showSubName = function () {
        console.log(this.name);
    };
    
    // 创建子类型的对象然后调用
    var subType = new SubType("宋江", 108);
    subType.showSupperName();
    subType.showSubName();
    console.log(subType.name);
    console.log(subType.brother);

    上面代码运行结果为:

    宋江

    宋江

    宋江

    108

 仔细思考一下,这种方法其实是有一定的缺点的,首先这种方法压根就没有用到父类原型,所以不能继承父类原型属性和方法。其次无法实现构造函数的复用,每个子类都有父类实例函数的副本,影响性能,代码会臃肿

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值