• JS 面向对象之继承 借用构造函数


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

    这种方法我们称之为借用构造函数(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

    以上代码,SuperType构造函数接受一个name参数,直接赋给this.name属性。在调用SubType构造函数内部调用SuperType构造函数时,实际上是为SubType的实例设置name属性。

    共用构造函数的问题:

    方法都在构造函数内部定义,函数的复用性就无从谈起了。在超类型的原型中定义的方法,对子类型而言是不可见的。考虑这些问题,借用构造函数也是很少单独使用。

  • 相关阅读:
    解决PKIX:unable to find valid certification path to requested target 的问题
    Linux 上的常用文件传输方式介绍与比较
    用VNC远程图形化连接Linux桌面的配置方法
    红帽中出现”This system is not registered with RHN”的解决方案
    linux安装时出现your cpu does not support long mode的解决方法
    CentOS SSH配置
    es6扩展运算符及rest运算符总结
    es6解构赋值总结
    tortoisegit安装、clon、推送
    es6环境搭建
  • 原文地址:https://www.cnblogs.com/yangjinjin/p/2889519.html
Copyright © 2020-2023  润新知