Two ways to add members to the prototype of a constructor in JS

First, JS adds properties and methods to the prototype object.

Mode one: The object's dynamic effects add members to the prototype object

Syntax: constructor. prototype. Method name =function () {}

Mode two: Replace the prototype object (not overwrite, but replace, replace the original name directly with the current)

Syntax: constructor. prototype. Method Name ={}

Tips: Method Two is not commonly used, as this will modify the prototype itself

Search: JS The difference between adding a member method through a constructor and adding a member method by using the prototype method

Reference URL http://blog.csdn.net/xxmzumeng/article/details/38422615

① the functions assigned by the prototype method are shared by all objects.

② the properties assigned by the prototype method are independent. (If you do not modify the properties, they are shared)

③ Recommendation: If we want all objects to use the same function, it is best to use the prototype method to add functions, which saves memory.

The constructor method works well, but there is a problem of wasting memory.

See, we now add a constant property "type" for the Cat object, and then add a method eat (Eat mouse). So, the prototype object cat becomes the following:

function Cat (name,color) {

THIS.name = name;

This.color = color;

This.type = "Cat animal";

This.eat = function () {alert ("Eat Mouse");

}

The same approach is used to generate an instance:

var cat1 = new Cat ("Da Mao", "Yellow");

var cat2 = new Cat ("Er Mao", "Black");

alert (Cat1.type); Cat Animals

Cat1.eat (); Eat mice

There seems to be no problem on the surface, but there is a big drawback in actually doing so. That is, for each instance object, the type attribute and the Eat () method are identical, and each time an instance is generated, it must be a duplicate of the content and occupy more memory. This is neither environmentally friendly nor inefficient.

Alert (cat1.eat = = cat2.eat); False

Can the type attribute and the Eat () method be generated only once in memory, and then all instances point to that memory address? The answer is yes.

5. Prototype mode

JavaScript specifies that each constructor has a prototype property that points to another object. All properties and methods of this object are inherited by an instance of the constructor.

This means that we can define the invariant properties and methods directly on the prototype object.

function Cat (name,color) {

THIS.name = name;

This.color = color;

}

Cat.prototype.type = "Cat animal";

Cat.prototype.eat = function () {alert ("Eat Mouse")};

Then, build the instance.

var cat1 = new Cat ("Da Mao", "Yellow");

var cat2 = new Cat ("Er Mao", "Black");

alert (Cat1.type); Cat Animals

Cat1.eat (); Eat mice

The type attribute of all instances and the Eat () method are, in fact, a memory address that points to the prototype object, thus improving operational efficiency.

Alert (cat1.eat = = cat2.eat); True

Two ways to add members to the prototype of a constructor in JS