How object-oriented implementations in JavaScript encapsulate

Object-oriented approach to encapsulate JavaScript, JavaScript is not the concept of class.

So the encapsulation that we talked about today is actually implemented using JavaScript functions.

1 2 3 4

var people{ name: ' A commoner ', Age : ' + ' };

This is an object in JavaScript that encapsulates 2 properties.

Instantiate an instance of an object people

1 2	var people=new people (); Console.log (People.name,people.age); //A commoner,

If we need to return an object in the function, the following code:

1 2 3 4 5 6

function createpeople () { return { name: ' A commoner ', Age : ' + ' }; }

When we need to create a person in the code, we need to call createpeople, but there is a problem, that is, we get the same person a commoner, 30 years old. It seems that we need to transform a function.

1 2 3 4 5 6

function createpeople (name,age) { return { Name:name, Age:age } }

It looks a lot better. We instantiate 2 objects.

1 2	var p1=new createpeople (' Zhang San ', +); var p2=new createpeople (' John Doe ', +);

We know that JavaScript from object to other global classes has a prototype object pointing to the prototype chain.

However, p1,p2 two objects seem to have no relation, although the same function is created, but createpeople each time return a completely new object, seemingly p1,p2 relationship is not small.

If you have been exposed to programming in object-oriented languages, you should think of the constructor, but the Createpeople function above is not a constructor, and we can also use JavaScript functions to generate a constructor function.

1 2 3 4

function createpeople (name,age) { this. name=name; this. age=age; }

This, like other languages, is also a pointer variable to an instance.

When you create an object with this constructor, this points to the newly created object, and one thing to remember is that this depends on calling the function scope instead of using the function's scope.

By encapsulating the constructor, the resulting object is much more pleasing than it looks.

2 attributes point to the This instance pointer, and we'll take another method to get the property (which can also be understood as a private variable)

1 2 3 4 5 6 7

function  createpeople (name,age) {     this.name=name;     this.age= Age;     this.getname= function () {         return  this.name;     } }

The GetName method is simple, which is to return the value of the Name property in the object.

Instantiation of 2 objects

1 2	var p1=new createpeople (' Zhang San ', +); var p2=new createpeople (' John Doe ', +);

1 2	Console.log (P1.getname ()) //Zhang San Console.log (P2.getname ()) //John Doe

At this moment, the feeling of the high on the package, in fact, we did not find that the GetName function in the Createpeople constructor is very simple, but each time in the instance to create a function like this is a bit of a waste of memory, we look at the following code.

1	Console.log (P1.getname==p2.getname); //false

Return false, tell us p1,p2 in GetName not point to an address in memory, we save memory, how to let Createpeople build out of objects, there is more GetName method point to a pointer address? Yes, on the prototype chain of Object.

We define this method on the prototype chain of the constructor, so that the new object that is constructed will inherit this method from the prototype chain (the specific JavaScript inheritance we open a separate blog discussion)

1 2 3 4 5 6 7 8 9 10 11 12 13 14

function createpeople (name,age) { this. name=name; this. age=age; } Createpeople.prototype.getname=function() { return this . Name; } var p1=new createpeople (' Zhang San ', +); var p2=new createpeople (' John Doe ', +); Console.log (P1.getname==p2.getname); //true

You can see that both the P1 and P2 objects inherit the GetName method from the Createpeople prototype, and this method pointer for all objects points to an address.

In this way, the purpose of our encapsulation is achieved.

How object-oriented implementations in JavaScript encapsulate