JavaScript Object-Oriented programming (6) encapsulation

Encapsulation is one of the important concepts of object-oriented. If a program has no encapsulation, there is no object oriented. However, JavaScript is not like other languages, such as Java, with public and private variables, and there is only one scope in javascript: public scope. In this chapter, we'll see how JavaScript implements the encapsulation feature.

1.this and public variables

First you need to understand the this keyword. Take a look at the following code, and you should be familiar with it:

function Person(name, age) {
　this.name = name; // 定义一个公有变量
　this.age = age;
　this.show = function() { // 定义一个公有函数
　　alert("name: " + name + "; age: " + age);
　}
}
var bill = new Person("Bill", 20);
alert(bill.name);
bill.show();

Here the This keyword is essential. The front is just let everybody remember, then why do this? To think about JavaScript objects, JavaScript objects are similar to hashes, a <string, a set of object> key-value pairs. The properties of objects here are actually discrete and are not bound to an object like any other language. The This keyword refers to the caller of the property or function, that is, who called the property or the function. As you can see, this is different from this in Java or C + +, which is the object itself in which the attribute or function resides. The purpose here is to bind the property or object followed by it to the caller. Recall the JavaScript new process by first creating an empty object and then initializing the object with the constructor, and finally returning the object. In this process, JavaScript will replace this with this object, which is to associate the object with these properties or functions, and it looks like the caller owns the property or function, which is actually the role of this.

So it seems that the name and age in show don't have a keyword, but it's OK to do it and you'll see what's going on--because I've already used this to associate name with the object Bill, and show is associated with this bill variable, So JavaScript is able to find these two variables.

All that seems to be decorated by this is a public variable. That's true, if you want to make a variable public, you can use this. The name and age, like the code above, are public variables that can be accessed by using Aperson.name or aperson.age outside.

2. Private variables

How do you declare a private variable? As a matter of fact, JavaScript has no private scope at all, as previously said. So look at the following code:

function Person(name, age) {
　var name = name; // 私有属性
　var age = age;
　var show = function() { // 私有函数
　　　alert("name: " + name + "; age: " + age);
　}
}
var bill = new Person("Bill", 20);
alert(bill.name); // undefined
bill.show(); // error, 不存在

This code is almost identical to the previous one, except that this is changed to Var in front of the attribute. We know that VAR is used to declare variables. The show function and bill.name are undefined! What the hell is going on here?

Recall the previous process of JavaScript new. Because name and age are declared using Var, JavaScript sees it as an ordinary variable, so that after the construction initialization is completed, the constructor returns and the variable is inaccessible because it is outside the scope. In other words, we use JavaScript variable scopes to simulate private properties.

3. Static variables

Static variables are bound to the top of the class. For different objects, they share a static variable.

Person.num = 0; // 静态属性
function Person() {
　this.show = function() {
　　alert("num: " + Person.num);
　};
　Person.num++;
}
var bill = new Person();
bill.show(); // 1
var tom = new Person ();
tom.show(); // 2
bill.show(); // 2

It's easy to add static properties in JavaScript, because JavaScript objects are hashes, so simply add a property or function after the class name.