Special object-oriented and inheritance in javascript (Getting Started)

Special object-oriented and inheritance in javascript (Getting Started)
Many Javascript learners have heard that everything in Javascript is an object. When I first came into contact with javascript object-oriented programming, it was quite messy. At that time, I used to apply PHP's facial image object idea to js, in fact, there are many differences between js object-oriented and traditional object-oriented. Here, we will no longer explain what basic object-oriented is. By default, we all know the concept of object-oriented. First, in the current js version, the class keyword is still not introduced. js does not have the class concept. When other languages instantiate an object, they all use the new class name to get the instance, because js does not have a class, its object-oriented method can also be understood as a simulation method. First, let's take a look at the functions in js. All functions in js have a feature, that is, all functions have a return value. If we do not manually write a return value. Then the function will return an underfind. If you write it, the value you write will be returned. This type of return value occurs when a function is called normally. For example, function a () {return 123;} a (); at this time, 123 is returned. Function a () {} a (); then underfind is returned. So, when we call functions in js, there are actually more than this method. The call or apply method can also be used to execute the function, which will be discussed later. In addition, we can use the new method to call functions. new is actually an operator in js. If a function is called through it, the return value will change. If the return value is not written in the function or the returned value is not the data of the object type, this function returns an empty object. If the returned value is an object, then, the written object is returned. So as long as the function is called through new, the return value becomes an object. Js also makes full use of this to simulate traditional object-oriented methods. Let's look at an example:

Function Obj () {this. name = 'red'; this. age = '24';} var poeple = new Obj ();

 

As we have mentioned above, when we use new to call a function, the object is returned, so we can know that people is actually an object. In the above Code, this. name = 'xiaohong', this. age = '24'. What is this actually? In fact, this is the object we return, that is, this is people. If you cannot understand it, remember that this is a feature of js. Next we will see:

Function Obj () {this. name = 'small red'; this. age = '24';} var poeple = new Obj (); alert (people. name); alert (people. age );

 

After the above Code is run, the red and 24 are displayed respectively, which gives a more accurate description that this is people. however, this is not necessarily just people. To be exact, it depends on who calls this function. For example:

Function Obj () {this. name = 'red'; this. age = '24';} Obj ();

 

Who will this point to when I call it like this? In fact, js is running in the browser, and there is a top-level object in the browser called window. All the variables and functions are actually stored in it. Let's look at the example:

　　Obj();　　window.Obj();

 

The two statements have the same effect. In this case, new is not called. In fact, it is a common function, and the caller of this function is window. Therefore, this indicates window. therefore, the point of this is not fixed. It depends on the specific call method and who is calling it. We generally call this type of function used to return objects a constructor. Its function is to create objects. Generally, to distinguish between constructors and common functions, the first letter of the constructor is capitalized. In my early studies, I confused the constructor here with the class in other languages. They are actually different things. The second is that js object-oriented objects also have the inheritance function, but its inheritance is different from the traditional inheritance method. I personally think it is also a simulation. First of all, one thing is that all objects in js have an attribute called _ proto _. All functions have the properties of _ proto _ and prototype, the value corresponding to the prototype attribute is an object. this object can store many things. The Chinese name is called a prototype object. For example: function Obj () {this. name = 'small red'; this. age = '24';} Obj. prototype. job = 'instructor '; var poeple = new Obj (); alert (people. job); // the pop-up instructor has just said that at this time, people is an object, and Obj is a function, and people is an object of an instance of Obj, they must be related, since people is an object, it must have the _ proto _ attribute. This attribute actually points to the prototype of Obj, the _ proto _ of people stores an address that points The prototype attribute of the constructor Obj of people. So the program runs to people. during job, the people object began to look for the job in its own attributes, but the wood found it, and then he found his _ proto __, find Obj. prototype: the job is found here. Then, the job value is displayed. The concept of this series of actions is called prototype chain search. Why do we need to talk about this? The main reason is that JavaScript inheritance is called prototype inheritance. The relation between the object and the constructor in terms of prototype has been clearly stated above. Next, let's talk about the prototype inheritance of js. Let's look at the example:

Function a () {this. name = 'small red'; this. age = '24';} function B () {this. job = 'small red'; this. sex = 'male';} B. prototype = new a (); var c = new B (); alert (c. name); // Xiaohong

 

The above Code makes a function to modify the prototype object of B to the instance object of a. When the Instance Object of B accesses the name attribute, it first searches for it and does not find it, so I went to the prototype of his constructor B to find it. At this time, the prototype of B is an instance object of a. Of course, the Instance Object of a has the name and age attributes, as a result, access is made. This method becomes prototype inheritance, and there is a small problem. In this way, the object is assigned to prototype, and the constructer attribute in prototype is modified. The constructer attribute will be discussed later. In addition to prototype inheritance, there are also some ways to implement inheritance. The most common methods are the call and apply methods. To explain this problem, you also need to understand another feature. We have seen it above, the call method can be used to call a function. In fact, its function is not limited to this. The core function is to change this point. Let's look at the example: At this time, Object c has three attributes: name age self, the first two are inherited. In fact, the actual writing process often uses the above two inheritance methods at the same time. Of course, there are some other inheritance methods that you can check on the Internet by yourself. Here, there is a problem with the prototype inheritance method above. Assigning an object to the prototype directly leads to an error in the constructor in the prototype. This constructor is actually used to save the constructor of the object, that is to say, an object is instantiated by the constructor, which represents the constructor. Example:

Function a () {this. name = 'small red'; this. age = '24';} var B = new a (); alert (. constructor); // The output is the entire function.

 

If the object is assigned to the prototype directly, the constructor value will be modified. Therefore, for the sake of security, many people will manually add a. prototype. constructor =