"JavaScript"--Anatomy of object-oriented and prototype (i)

In the object-oriented and prototype chapter, the feeling is quite interesting, and the video explanation is also very clear, here summed up the video

Talk about the content, by the way to organize their own ideas.

First draw a picture, the whole chapter of the knowledge Point.

The following specific knowledge points to analyze the relationship between the various points of knowledge:

Factory mode

The factory pattern is introduced to avoid a large number of repetitive problems during the creation of objects. It encapsulates some duplication in the process of creating objects

Code, which avoids code redundancy. To give a simple demo:

1, the ordinary creation of objects:

var p=new Object ();p. Name= ' Wang Hongyun '; alert (' Name: ' +p.name);

You need to repeat the above code when you need two people or more, resulting in code redundancy. At this time:

2. Factory mode:

function CreateObject (name) {var obj=new Object (); Obj.name=name;return obj;} var p1=createobject (' Wang Hongyun '), var p2=createobject (' Gold '), alert (' Name: ' +p1.name '), alert (' Name: ' +p2.name ');

No matter how many people you want to create, add it directly behind.

However, the Factory mode cannot specify which object the instance is dependent on, and the returned type value is "Object", which provides a very

More difficult. So the introduction of the: constructor function.

constructor Function

Unlike Factory mode, the first letter of the constructor must be capitalized, and in the function body, without the new object, the system automatically assigns the constructor

Number of objects created. So unlike Factory mode, which assigns properties and methods to object, the constructor is assigned directly to the This object. And the constructor does not return

return value (return).

What is the difference between a constructor and a normal function? The constructor must also be called with the new operator, except that the first letter must be capitalized.

Look at the code after the above example is transformed:

function Box (name) {this.name=name;} var p1=new box (' Wang Hongyun '), var p2=new box (' Gold '), alert (' Name: ' +p1.name '), alert (' Name: ' +p2.name ');

Remember where the benefits of constructors and factory patterns are? To know where the instances belong, right? Here, you only need to use "instanceof" to

Know if the created instance belongs to box.

The constructor looks pretty powerful, but the address is different when you call the same constructor. Because at the time of the call

As soon as new, an address is deposited, and another address is generated by the call. Small project to be nothing, but once the project is bigger, it

A waste of things or less to do well, so another knowledge: the prototype.

Prototypes

Let's look at the difference between the constructor and the prototype at the time of invocation:

constructor function:

Prototype:

We can see from the illustration that the prototype is pointing to the same object through the "_proto_" pointer in the box when it is in the instance, so the

When using prototypes, the addresses are the same.

It is also necessary to emphasize that in the prototype structure, the constructor body is not content, but once the constructor body has content, and the prototype

The values in the constructor are called first when the properties and methods in the method are duplicated.

Summary

I would like to analyze the following several ways, but the content will be many, and the blog will appear very cumbersome. So Donuts, and

And the following methods are in the factory model, the structure of the function and the prototype based on the deformation, so that the function is more abundant. So based on these three points of knowledge,

The content of the back is nothing.

Next blog Main want to say, JavaScript in the inheritance, in the process of combining PDF and video, feel here to say the inheritance and before the

The solution is still some slightly different, stay in the next time to say it ~

Copyright NOTICE: This article for Bo Master original article, without Bo Master permission not reproduced.

"JavaScript"--Anatomy of object-oriented and prototype (i)