Javascript Object-Oriented Programming (1): Generation of Objects

Javascript is an Object-Based programming language. It is often said that everything in javascript is an Object. How does one generate an Object?

(1) original mode

First, let's talk about our common Object-Object instance. There are many ways to create an Object instance. The first isUse the new operator followed by the Object constructor:

Var person = new Object (); person. name = "Zhang San"; person. age = 21;

Another method isObject literal representation:

Var person = {name: "Zhang San", age: 21}

The two methods are the original object generation mode. There is an obvious drawback in this writing: If we need n or more person objects, the encoding is quite cool. In this case, we need a factory to produce these person instances in batches.

(2) Factory Model

Function createPerson (name, age) {var o = new Object (); o. name = name; o. age = age; return o ;}
Var person1 = createPerson ("Zhang San", 20); var person2 = createPerson ("Li Si", 21 );

In this way, each time the createPerson function is called, we can create a person instance by inputting two parameters. In this way, objects can be created, but the relationship between classes and object instances cannot be reflected.

(3) constructor Mode

The so-called "constructor" is actually a common function, but this variable is used internally. You can use the new operator to generate an instance for the constructor, and this variable is bound to the instance object.

 

Function Person (name, age) {this. name = name; this. age = age;} var person1 = new Person ("Zhang San", 21); var person2 = new Person ("Li Si", 20 );

 

In this way, we can use the new Person constructor to create an instance object, slowly approaching the relationship between the "class" we know and the object instance, let's further expand this Constructor (after all, the attribute of the actual person is not just name and age ).

Function Person (name, age) {this. name = name; this. age = age; this. type = "advanced animal"; this. speak = function () {alert (this. name) ;}} var person1 = new Person ("Zhang San", 21); var person2 = new Person ("Li Si", 20 );

We have added the type attribute and the speek method for the object. We can find that each instance object, type attribute, and speak () method have the same content. Every time an instance is generated, it must be a duplicate of the content, occupying more memory, this will inevitably cause a lot of memory waste. Is there a way to share the same content separately so that all instance objects can be accessed?

(4) Prototype mode)

Javascript requires that each constructor has a prototype attribute pointing to another object. All attributes and methods of this object will be inherited by the constructor instance. Then we can directly define the identical content (unchanged attributes and methods) on the prototype object.

Function Person (name, age) {this. name = name; this. age = age;} Person. prototype. type = "advanced animal"; Person. prototype. speak = function () {alert (this. name);} var person1 = new Person ("Zhang San", 21); var person2 = new Person ("Li Si", 20); console. log (person1.type); console. log (person2.type); person1.speak (); person2.speak ();

In fact, this method is often referred to as the constructor mode + prototype mode. It is to put different parts in the constructor to construct, and put the same part in the prototype to share inheritance.

Conclusion: In combination with the above four object generation methods, we can create the objects we need based on actual development needs. In fact, the four modes do not have the advantages and disadvantages, it is the best way to maximize memory savings and code reuse efficiency.