通过借用构造函数解决超类型构造函数传参

上次讲到的原型链中,原型链存在一个问题就是不能向超类型的构造函数传递参数。那么这次就是要实现如何向超类型构造函数传递参数。

这种方法我们称之为借用构造函数(constructor stealing)

这里的实现方法是使用js的原生方法apply()或all()。那么先温习下apply()和all()函数的知识。

call方法: 
语法:call([thisObj[,arg1[, arg2[,   [,.argN]]]]]) 
定义:调用一个对象的一个方法,以另一个对象替换当前对象。 
说明: 
call 方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。 
如果没有提供 thisObj 参数,那么 Global 对象被用作 thisObj。 

apply方法: 
语法:apply([thisObj[,argArray]]) 
定义:应用某一对象的一个方法,用另一个对象替换当前对象。 
说明: 
如果 argArray 不是一个有效的数组或者不是 arguments 对象,那么将导致一个 TypeError。 
如果没有提供 argArray 和 thisObj 任何一个参数,那么 Global 对象将被用作 thisObj, 并且无法被传递任何参数。

call和apply方法通常被用来实现类似继承一样的功能,以达到代码复用的功效。它们的区别主要体现在参数上。

看例子:

复制代码
    function SuperType() {
        this.colors = ["red", "green", "blue"];
    }

    function SubType() {
        //继承了SuperType
        SuperType.call(this);
    }

    var instance1 = new SubType();
    instance1.colors.push("black");
    alert(instance1.colors); //red,green,blue,black

    var instance2 = new SubType();
    alert(instance2.colors); //red,green,blue
复制代码

通过call方法继承了SuperType。我们实际上是在新创建的SubType实例的环境下调用了SuperType构造函数。即执行了SuperType函数中定义的所有对象的初始化代码。

如何给超类型构造函数传递参数:

复制代码
    function SuperType(name) {
        this.name = name;
    }

    function SubType() {
        //继承了SuperType
        SuperType.call(this, "yangjinjin");
        this.age = 27;
    }

    var obj = new SubType();

    alert(obj.name); //yangjinjin
    alert(obj.age); //27

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
链继承(Prototype Inheritance)在JavaScript中是通过创建一个新对象并让它引用另一个对象的原来实现的。例如: ```javascript function Parent() {} Parent.prototype.method = function() { console.log('Parent method'); }; let child = new Parent(); child.method(); // 输出: "Parent method" ``` **借用构造函数继承**(Constructo r Chaining)利用已有构造函数作为父类,通过`new`关键字传递给子类实例化过程,间接实现了继承: ```javascript function Parent() { this.parentProp = 'parent'; } function Child() { Parent.call(this); // 借用父类构造函数 this.childProp = 'child'; } Child.prototype = Object.create(Parent.prototype); Child.prototype.constructor = Child; let childInstance = new Child(); console.log(childInstance.parentProp); // 输出: "parent" console.log(childInstance.childProp); // 输出: "child" ``` **组合式继承**(Mix-in or Prototype Mixing)结合原链和构造函数继承,允许从多个源继承属性和方法: ```javascript function Mixin(target) { for (let prop in Mixin.prototype) { target[prop] = Mixin.prototype[prop]; } } function Parent() { this.parentProp = 'parent'; } Mixin(Parent.prototype); let child = new Parent(); console.log(child.parentProp); // 输出: "parent" ``` **ES6的class类继承**(Class-based Inheritance)使用`extends`关键字实现: ```javascript class Parent { constructor() { this.parentProp = 'parent'; } parentMethod() { console.log('Parent method'); } } class Child extends Parent { constructor() { super(); this.childProp = 'child'; } childMethod() { console.log('Child method'); } } let childInstance = new Child(); childInstance.parentMethod(); // 输出: "Parent method" childInstance.childMethod(); // 输出: "Child method" ```

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值