JS --- understanding object-oriented in JavaScript

Source: Internet
Author: User

JavaScript is an object-based language. Almost everything we encounter is an object. JavaScript is an object-oriented language based on prototype, and has no class concept. Everything is derived from a copy of an existing object, therefore, JavaScript is not a real object-oriented programming language.

There are two types of objects in JavaScript:
One is an Object called a "common Object", that is, the numbers, dates, user-defined objects (such as: {}) that we generally understand.
The other is a Function object called a "method object. You may find it strange: The method is the method. How has it become an object? However, in JavaScript, methods are indeed processed as objects. The following is a simple example:
[Javascript]
1. <span style = "font-family: FangSong_GB2312; font-size: 18px;"> function func () {alert ('Hello! ');}
2. alert (func. toString (); </span>
In the above example, func is defined as a method, but it itself contains a toString method, indicating that func is processed as an object here. More accurately, func is a "method object ". Next we will give an example:
[Javascript]
1. func. name = "I am func ";
2. alert (func. name );
We can set any attribute for func, which means func is an object. So what is the difference between a method object and a common object? First, the method object is executable. Add a pair of parentheses to it to execute this method object.
[Javascript]
1. func ();
Therefore, the method object has a dual nature. On the one hand, it can be executed, and on the other hand it can be used as a common object. What does this mean? This means that the method object can be completely independent from other objects. This can be compared with java: in java, methods must be defined in a class and cannot exist independently; in JavaScript, methods are not required.
A Method object is independent of other methods, which means it can be referenced and transmitted at any time. Continue. See the following example.
[Javascript]
1. function invoke (f ){
2. f ();
3 .}
4. invoke (func );

Pass one method object func to another method object invoke and let the latter execute func at the appropriate time. This is the so-called "Callback. In addition, this particularity of the method object makes this keyword hard to grasp.
In addition to being executable, a method object can also be used to create common objects through the new keyword.
Each method object is automatically created with a prototype attribute. This attribute has nothing special to do with it. It can be accessed like other attributes and can be assigned values. However, when we use the new keyword to create an object, prototype takes effect: its value (also an object) contains all attributes, will be copied to the newly created object. The following is an example:
[Javascript]
1. func. prototype. name = "prototype of func ";
2. var f = new func ();
3. alert (f. name );
During execution, two dialog boxes are displayed: 'prototype of func' and 'Hello! 'Two dialogs. The next dialog box indicates that the newly created object f has copied the name attribute from func. prototype, and the previous dialog box indicates that func has been executed as a method. You may ask, why do you need to execute func again at this time? In fact, executing func at this time serves as a "constructor. To illustrate the image, let's take another example:
[Javascript]
1. function func (){
2. this. name = "name has been changed ";
3 .}
4. func. prototype. name = "prototype of func ";
5. var f = new func ();
6. alert (f. name );
At this time, we will find that the name attribute of f is not 'prototype of func', but is replaced with 'name has been changed '. this is the role of the 'constructor 'played by the func object method.
Note: The name in the constructor will pop up here because the object does not have this attribute when searching for an attribute, it will be found in the object pointed to/referenced by prototype of the constructor to see if the same name attribute can be found. If the same name attribute is found, it will be used directly.
<The reason why an object can execute the prototype attribute definition method is that the object generated by the constructor method is closely related to the constructor method. If the object does not have this attribute, it will be found in the object pointed to/referenced by the propotype of the constructor to see if the property with the same name can be found. If it is found, it will read its value and return it. (This process will continue until the Object is reached, that is, prototype inheritance).>
========================================================== ========================================
In JavaScript, the following three steps are performed to create an object with the new Keyword: <this need to be discussed>
1. Create a new common object;
2. Copy all properties of the prototype attribute of the method object to the new common object.
3. Use a new common object as the context to execute the method object.
========================================================== ========================================
A statement like "new func ()" can be described as "Creating a new object from func ". In short, the only special feature of the prototype attribute is that it is time to create a new object.

So we can use this. For example, there are two method objects A and B. Since the new object created from A contains all. attribute of prototype, then I will assign it to B. prototype, so the new object created from B does not have the same attribute? The Code is as follows:
[Javascript]
1. var A = new Function ();
2. var B = new Function ();
3. A. prototype. hello = function () {alert ('Hello! ');}
4. B. prototype = new ();
5. new B (). hello ();

This is the so-called "inheritance" of JavaScript. Its essence is the copy of attributes. prototype is used here. If prototype is not used, a loop is used, and the effect is the same. The so-called "Multi-inheritance" is naturally copied everywhere.

The object-oriented principle in JavaScript is understood as this for the moment. JavaScript does not have the "class" thing. Can there be no class for Object-Oriented objects? Of course. It is unreasonable to have a class first and then an object again, because the class is originally summarized from the object, and the object has another class first. This is reasonable. As shown below:
[Javascript]
1. var obj ={}; // I found a stuff.
2. obj. eat = function () {return "I am eating."}; // I found it will eat;
3. obj. sleep = function () {return "ZZZzzz..."}; // I found it sleeping;
4. obj. talk = function () {return "Hi! "}; // I found it talking;
5. obj. think = function () {return "Hmmm..."} // I think about it.
6.
7. var Human = new Function (); // I decided to name it "person ".
8. Human. prototype = obj; // This item represents the concept of all "people.
9.
10. var h = new Human (); // when I find something the same as it,
11. alert (h. talk (); // I will know that it is also a "person!


 

Author: mazhaojuan

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.