[Inheritance] ECMAScript5

Use ECMAScript implementation inheritance, you can start from a base class to inherit. All developer-defined classes can be used as a base class. For security reasons, the local host classes and classes can not be used as a base class, so public access to compiled browser-level code to prevent, because the code can be used for malicious attacks.

After selecting a base class, you can create a subclass of it. Whether to use a base class entirely up to you. Sometimes, you may want to create a base class can not be directly used, it is only used to provide a common sub-type of function. In this case, as an abstract class is a base class.

Although ECMAScript not as strictly defined abstract class like any other language, but sometimes it does create some kind allowed. Usually, we call this class is an abstract class.

Create a subclass will inherit all the properties and methods of the superclass, including the realization of constructors and methods. Remember, all properties and methods are public, so subclasses can directly access these methods. Subclasses may not add new attributes and methods of the superclass, properties and methods of superclasses may be covered.

First, the object masquerading

We first define the ClassA and ClassB

function ClassA(sColor) {
    this.color = sColor;
    this.sayColor = function () {
        alert(this.color);
    };
}

function ClassB(sColor) {
}

This object belongs here pointed. This principle is ClassA as a regular function to establish the inheritance mechanism, rather than as a constructor. Use the following ClassB constructor inheritance mechanism can be achieved:

function ClassB(sColor) {
    this.newMethod = ClassA;
    this.newMethod(sColor);
    delete this.newMethod;
}

In this code, a method for the ClassA given newMethod (Remember, the function name just a pointer to it). The method is then invoked, it is passed to the constructor parameter sColor ClassB. The last line of code to delete the reference to ClassA, so that later you can not call it.

All the new properties and methods must be defined after deleting the lines of the new method. Otherwise, it may cover the properties and methods of the superclass:

function ClassB(sColor, sName) {
    this.newMethod = ClassA;
    this.newMethod(sColor);
    delete this.newMethod;

    this.name = sName;
    this.sayName = function () {
        alert(this.name);
    };
}

Run the following codes:

var objA = new ClassA("blue");
var objB = new ClassB("red", "John");
objA.sayColor();    //输出 "blue"
objB.sayColor();    //输出 "red"
objB.sayName();        //输出 "John"

Object masquerading can achieve multiple inheritance

If there are two classes ClassX and ClassY, ClassZ want to inherit two classes, you can use the following code:

function ClassZ() {
    this.newMethod = ClassX;
    this.newMethod();
    delete this.newMethod;

    this.newMethod = ClassY;
    this.newMethod();
    delete this.newMethod;
}

Here there is a drawback if two or class attributes and methods ClassX CLASSY having the same name exists, CLASSY has a high priority. Because it inherits from the back of the class. In addition to this little problem with object masquerading easy to achieve multiple inheritance.

Two, call () and apply ()

As the popularity of this method of inheritance, ECMAScript is the third edition of the Function object added two methods, namely call () and apply ().

1. call () method

call () method is the method most classical objects posing a similar way. Its first object is used as a parameter of this. Other parameters are directly passed to the function itself.

function sayColor(sPrefix,sSuffix) {
    alert(sPrefix + this.color + sSuffix);
};

var obj = new Object();
obj.color = "blue";

sayColor.call(obj, "The color is ", "a very nice color indeed.");

In this example, the function sayColor () is defined outside the object, even if it does not belong to any object, it may be cited keyword this. Color property of object obj is equal to blue. When you call call () method, the first argument is obj, instructions should be given sayColor () this function key values ​​are obj. The second and the third argument is a string. They () parameters and sSuffix sPrefix sayColor match function, and finally generated message "The color is blue, a very nice color indeed." Will be displayed.

To use the inheritance mechanism of object masquerading method with this method, simply assign the first three rows, delete and replace the code to call:

function ClassB(sColor, sName) {
    //this.newMethod = ClassA;
    //this.newMethod(sColor);
    //delete this.newMethod;
    ClassA.call(this, sColor);

    this.name = sName;
    this.sayName = function () {
        alert(this.name);
    };
}

ClassA ClassB keywords in this equal to the newly created object, so this is the first parameter. The second argument sColor for two classes are unique parameters.

2. apply () method

apply () method has two parameters, and this object is used to pass arguments to a function of the array.

function sayColor(sPrefix,sSuffix) {
    alert(sPrefix + this.color + sSuffix);
};

var obj = new Object();
obj.color = "blue";

sayColor.apply(obj, new Array("The color is ", "a very nice color indeed."));

This method is also used to replace the first three rows of the assignment, and remove the code calls the new method:

function ClassB(sColor, sName) {
    //this.newMethod = ClassA;
    //this.newMethod(sColor);
    //delete this.newMethod;
    ClassA.apply(this, new Array(sColor));

    this.name = sName;
    this.sayName = function () {
        alert(this.name);
    };
}

If the order of the parameters in the superclass and subclass parameter order is exactly the same, we can also ClassB arguments entire object as the second parameter passed to apply () method:

function ClassB(sColor, sName) {
    //this.newMethod = ClassA;
    //this.newMethod(sColor);
    //delete this.newMethod;
    ClassA.apply(this, arguments);

    this.name = sName;
    this.sayName = function () {
        alert(this.name);
    };
}