The topic of this chapter is inheritance, which is divided into the upper and lower sections. It mainly introduces the call and apply methods, and introduces several inheritance implementation methods.
When introducing inheritance, call and apply are a topic that you can't go around and need to understand deeply. Next let's take a look at the definition of call (The apply and call are basically the same, but the parameters are different. We will not introduce them here ):
?
Call Method
See
Applied to: Function objects
Requirements
Release 5.5
Call a method of one object to replace the current object with another object.
Call ([thisObj [, arg1 [, arg2 [, [,. argN])
Parameters
ThisObj
Optional. Will be used as the object of the current object.
Arg1, arg2, and argN
Optional. The method parameter sequence will be passed.
Description
The call method can be used to call a method instead of another object. The call method can change the object context of a function from the initial context to the new object specified by thisObj.
If the thisObj parameter is not provided, the Global object is used as thisObj.
The definition is always hard to understand, or directly in the example above.
Example 1:
Function Person (name ){
This. name = name;
This. getName = function (){
Return this. name;
}
}
Function Man (name, age ){
Person. call (this, arguments [0]);
This. age = age;
This. setAge = function (age ){
This. age = age;
}
}
Var man = new Man ('jason ', 'Man ');
Alert (man. getName (); // jason
Take Person. call (this, argument [0]) as an example:
Caller of the call method: the method of an object (in js, the method/function is also an object), the caller is, Person
Parameters of the call method: a new object (man), which is used to intercept the object Person and run the getName method originally belongs to the Person; argument [0] is used to pass parameters to method.
Result of the call method: Person. call (man, argument [0]) is similar to: man = new Person (argument [0]).
The role of the call method: the Person method is reused and shared, with special effects of new to implement inheritance.
So what exactly can call inherit from? I will introduce it through the example below.
In the preceding example, call is called in the constructor. Can the code be inherited during code execution outside the constructor?
Example 2:
Function Person (name ){
This. name = name;
This. getName = function (){
Return this. name;
}
}
Function Man (name, age ){
This. age = age;
This. setAge = function (age ){
This. age = age;
}
}
Var man = new Man ('jason ', '25 ');
Person. call (man, 'jason ');
Alert (man. getName (); // jason
Through testing, man inherits the getName function of Person. The call method is called using Person for the first two times. This time we change to person to see how it works.
Example 3:
Function Person (name ){
This. name = name;
This. getName = function (){
Return this. name;
}
}
Function Man (name, age ){
This. age = age;
This. setAge = function (age ){
This. age = age;
}
}
Var person = new Person ('person ');
Var man = new Man ('jason ', '25 ');
Person. call (man, 'jason ');
Alert (man. getName (); // person. call is not a function
The error is reported because the call caller can only be a Function object, the person is a Function instance, and the Person is a Function object.
So this time we use person. getName to call the call and see what the result will be.
Example 4:
Function Person (name ){
This. name = name;
This. getName = function (){
Return this. name;
}
}
Function Man (name, age ){
This. age = age;
This. setAge = function (age ){
This. age = age;
}
}
Var person = new Person ('person ');
Var man = new Man ('jason ', '25 ');
Person. getName. call (man, 'jason ');
Alert (man. getName (); // man. getName is not a function
There will certainly be some questions here. Isn't it possible to call a call as a method, then man should inherit the getName. The first half is correct, but the last half is not necessarily true. What exactly does call inherit from?
Example 5:
Function Person (name ){
This. name = name;
This. getName = function (){
This. address = 'address'; // The code is slightly changed. A variable is added to the getName method.
Return this. name;
}
}
Function Man (name, age ){
This. age = age;
This. setAge = function (age ){
This. age = age;
}
}
Var person = new Person ('person ');
Var man = new Man ('jason ', '25 ');
Person. getName. call (man, 'jason ');
// Here we traverse man to see which objects it contains
For (pro in man ){
Alert (pro + ":" + man [pro]);
}
// Input result:
// Age: 25
// SetAge: function (age ){
// This. age = age;
//}
// Address: address
The result is very special. There is an extra address. The result is obvious. The caller who calls the call will inherit the instance object inside the caller, rather than the caller.
Next we are doing the last test to check whether the call can inherit the objects in the prototype of the object.
Example 6:
Function Person (name ){
This. name = name;
}
Person. prototype. getName = function (){
Return this. name;
}
Function Man (name, age ){
This. age = age;
This. setAge = function (age ){
This. age = age;
}
}
Var man = new Man ('jason ', '25 ');
Person. call (man, 'jason ');
Alert (man. getName (); // man. getName is not a function
Obviously, the call method cannot inherit the caller's prototype object, but can only inherit the caller's internal instance object.
Today's content is here, and I hope to help you.
Author: kbh1983