Review Javascript Inheritance Mechanism

I. Tell a story.
Clarify the relationship between Java and Javascript as Lei Feng tower. Javascript, formerly known as Mocha, was also called LiveScript. It was created by Brendan Eich and is now the chief technology officer of Mozilla.
In 1994, Navigator0.9, the first mature web browser in history, was born in Netscape.
However, Navigator0.9 can only be used for browsing and does not have the ability to interact with visitors. For example, if a user submits a data form and the form is empty, the browser cannot judge it, it can only be submitted directly to the server, and then the null value error is returned, so that users can enter it again, which is obviously inefficient and a waste of resources.
At this time, for Netscape, which is at the forefront of technological innovation, it is necessary to develop a practical client scripting language to deal with these problems, so this task falls into engineer Brendan Eich. In his opinion, it is necessary to make the design complex, as long as some simple operations can be done, such as determining whether the user has entered a form.
In 1994, object-oriented programming (object-oriented programming) was booming. C ++ was the most popular language, and Java version 1.0 was about to be released in the next year, brendan Eich is inevitably affected. He wants to regard all the data types in Javascript as objects, which is very similar to Java. However, he immediately encountered a problem. Do he need to design an inheritance mechanism?
Ii. Evolution of Inheritance
1. Use the new Keyword to generate an instance
A simple functional scripting language like Form Verification obviously does not require the "inheritance" mechanism. However, if Javascript contains all objects, there is a way to link all objects. Finally, Brendan Eich designed "inheritance ". However, he didn't introduce the concept of "class" because Javascript is a complete object-oriented programming language once "class" is introduced,
This seems a little too formal, far from the original design, and increases the difficulty of getting started for beginners.
Refer to C ++ and Java to use the new command to generate an instance:
Write C ++ as follows:
ClassName * object = new ClassName (param );
Write Java as follows:
Foo foo = new Foo ();
You can also introduce the new command to Javascript to generate an instance object from the prototype object. However, if Javascript does not contain a "class", how does one represent a prototype object?
Constructor is called when C ++ and Java use the new command ). Brendan Eich simplifies the design. In Javascript, the new command is followed by a constructor instead of a class.
For example, there is a prototype called WD constructor that represents a web-developper object.
Function WD (skill ){
This. skill = skill;
}
Using the new keyword for this constructor generates an instance of the front-end development object.
Var WD1 = new WD ('html ');
Console. log (WD1.skill); // html
The this keyword in the constructor actually represents the newly created instance object.
2. Defects of new objects
Using the new keyword, instance objects generated using constructors cannot share attributes and methods.
For example, in the WD object constructor, set a common property skill for an instance object.
Function WD (skill ){
This. skill = skill;
This. sex = 'male ';
}
Then, two instance objects are generated:
Var WD1 = new WD ('html ');
Var WD2 = new WD ('css ');
The skill attributes of these two objects are independent. Modifying one of them does not affect the other.
WD1.skill = 'javascript ';
Console. log (WD2.skill); // "css", not affected by WD1
Each instance object has its own copy of attributes and methods. This is not only unable to achieve data sharing, but also a great waste of resources.
3. Introduce prototype attributes
To share attributes and methods, Brendan Eich decided to set a prototype attribute for the constructor.
This attribute contains an object (hereinafter referred to as "prototype object"). All the attributes and methods to be shared by instance objects are placed in this object. Those attributes and methods that do not need to be shared are not included in this object, put it in the constructor.
Once an instance object is created, the attributes and methods of the prototype object are automatically referenced. That is to say, the attributes and methods of the Instance Object are divided into two types: local and referenced.
Taking the WD constructor as an example, we can rewrite it with the prototype attribute:
Function WD (skill ){
This. skill = skill;
}

WD. prototype = {sex: 'male '};

Var WD1 = new WD ('html ');
Var WD2 = new WD ('css ');

Console. log (WD1.sex); // male
Console. log (WD2.sex); // male
Now, the sex property is stored in the prototype object, which is shared by two instance objects. If the prototype object is modified, the two instance objects are affected at the same time.
WD. prototype. sex = 'female ';
Console. log (WD1.sex); // female
Console. log (WD2.sex); // female
Because all instance objects share the same prototype object, prototype objects seem to be prototype objects, while instance objects seem to "inherit" prototype objects. This is the design idea of the Javascript Inheritance Mechanism.

• Four pages in total:
• Previous Page
• 1
• 2
• 3
• 4
• Next Page