JavaScript Learning Summary-creating objects (5_ or prototypes)

Why is this so endless? We wrote this when we created the object using the prototype + constructor blending mode.

function Person (name,age) {  this. name=name;    this. age= age;} Person.prototype.sayName=function() {   Console.log (this. name);} var person1=New person (' Sakura ', $);p erson1.sayname ();

The obvious problem is that this code creates objects that don't seem to be as perfect as we think, Person.prototype written out of the constructor, so it looks awkward, and we say encapsulation, how did this not get a piece, how did I go my separate ways?

Then I thought I'd write it that way, right?

function Person (name,age) {  this. name=name;    this. age= age;  Person.prototype.sayName=function() {    Console.log (this. name);}  } var person1=New person (' Sakura ', $);p erson1.sayname ();

Isn't it perfect, perfect, right?

But let's do one more experiment.

function Person (name,age) {  this. name=name;    this. age= age;  Console.log (' prototype creation start ');  Person.prototype.sayName=function() {    Console.log (this. Name);  }  Console.log (' End of prototype creation ');} var person1=New person (' Sakura ', +); var person2=New person (' Misaka ', 20);

This code means that every time the instantiation object initializes the prototype object, it will output a word in the console before it is created, and then the result is run.

It's obvious that there's a problem with this, instantiating two objects, and then initializing the prototype two times, is it not a waste, should we confirm that there is a method in the prototype before initializing the prototype object, if there is no initialization, if it does not exist and then initialize the prototype?

So this is the perfect body for the teacher.

functionPerson (name,age) { This. name=name;  This. age=Age ; if(typeof  This. sayname! = ' function ') {Console.log (' Prototype creation started '); Person.prototype.sayName=function() {Console.log ( This. Name); } console.log (' End of prototype creation '); }}varperson1=NewPerson (' Sakura ', 22);varPerson2=NewPerson (' Misaka ', 20);//prototype creation started//End of prototype creation

Properly, this method only needs to be judged once and avoids the problem of duplicate initialization of the prototype, which is called Dynamic prototype mode .

One thing to note, though, is that you cannot use object literals to rewrite prototypes when using dynamic prototype mode, because rewriting the prototype will cut off the connection between the existing instance and the new prototype in the case where the instance has already been created

So, there are many ways to choose the right one for you.

I used five blog posts to explain the encapsulation of the object of several common methods (not seen by the small partners can be turned upside down), I also just self-study for a few months of beginners, if there is anything written in the wrong place welcome message points, I will promptly correct

I deliberately omitted some of the professional terminology (such as encapsulation and object-oriented, etc.), is to avoid beginners feel too obscure and difficult to understand, but also for beginners to read that "Oh, this is the object-oriented package Ah", not to be confused by some terminology

Examples and some of the concepts cited in the advanced programming of JavaScript

In addition, there are two more uncommon methods for encapsulating objects, which will be used in subsequent blog post

JavaScript Learning Summary-creating objects (5_ or prototypes)