Introduction to the JavaScript encapsulation Design Mode

For those familiar with C # and Java, the three main object-oriented ideas (encapsulation, inheritance, and polymorphism) must understand. So how can we use this feature in Javascript?

We will abstract some things in reality into a Class, and take the attributes (nouns) of things as the Class Property, and take the action (verb) of things as the Class methods. In object-oriented languages (C # and so on), some keywords are used to modify the class or attribute (Private, public, protect). These keywords describe the access permission and do not explain it much.

Let's take a look at the easy-to-change features of Javascript (we also use an example ):

var Man = function (name, age) {             this.Name = name;             this.Age = age;       }      var Person = new Interface("Person", ["GetName", "GetAge"]);            Man.prototype = { GetName: function () { return this.Name; },            GetAge: function () { return this.Age; }        }           var Gonn = new Man("Gonn", 25);      alert(Gonn.GetAge());    Gonn.DisplayAll = function () { return "Name: "+this.GetName() + "; Age: " + this.GetAge() }   alert(Gonn.DisplayAll());

First, create a Class (Javascript anonymous method) with two public fields (this blog will explain in detail, continue to look down) and two public methods, we created an Instance -- Gonn, But I can dynamically Add a DisplayAll method to this Instance. I don't think any object-oriented language can do this, one of the most flexible expressions of Javascript.

Now let's assume that in a scenario, if many programmers use this code, the programmer can change the Name value after instantiation due to Javascript's variability, then the initialization will be meaningless:

var Gonn = new Man("Gonn", 25);Gonn.Name = "Alice";alert(Gonn.GetName());

Therefore, we cannot allow external users to modify this field arbitrarily. in Java or C #, we only need to change this field to Private, so everything is fine, but Javascript does not have this keyword, so we need to do this. We can think about how we can do this in addition to setting Private in C? We can set the Setter and Getter methods.

Let's modify the above Code: Method 1:

Var Person = new Interface ("Person", ["SetName", "SetAge", "GetName", "GetAge"]); var Man = function (name, age) {this. setAge (age); this. setName (name);} Man. prototype = {SetName: function (name) {this. name = name ;}, SetAge: function (age) {this. age = age ;}, GetName: function () {return this. name ;}, GetAge: function () {return this. age ;}} var Alan = new Man ("Alan", 25); Alan. name = "Alice"; // tragedy. When I was alert, I became Alan. setAge (10); // tragedy. Someone else gave my age to such a small alert (Alan. getName (); Alan. displayAll = function () {return "Name:" + this. getName () + "; Age:" + this. getAge ()} alert (Alan. displayAll ());

It looks like Setter and Getter in C #, but they can still be modified externally. But from the perspective of constraints, it seems better than the above code. You can set the initial value through methods. But the problem persists. Let's take a look at the following method: closure. In Javascript, This keyword is used to develop permissions (Public ). Before talking about the closure, we need to understand the nature of the closure: In Javascript, only the method has a scope. If the variables declared in the method are not accessible externally, the concept of Private came out.

Var Person = new Interface ("Person", ["SetName", "SetAge", "GetName", "GetAge"]); var Man = function (newname, newage) {var name, age; this. setName = function (newname) {name = newname;} this. setAge = function (newage) {age = newage;} this. getName = function () {return name;} this. getAge = function () {return age;} this. setAge (newage); this. setName (newname);} var Alan = new Man ("Alan", 25); Alan. name = "Alice"; // now the name is private, and I cannot modify Alan. setAge (10); alert (Alan. getAge ());

Now the private function is implemented. We just use Var to replace This. // We call Public methods that can access Private methods as privileged methods, such as the preceding this. SetName, this. SetAge.

If our public method does not involve access to Private fields, we can put them in Prototype. // The advantage is that there is only one copy in the memory for multiple instances.

Man.prototype.DisplayAll = function () { return "Name: " + this.GetName() + "; Age: " + this.GetAge() }

Haha ~ Let's take a look at some difficult things: static variables and methods.

We all know that static things belong to Classes. Let's modify the above Code:

var Person = new Interface("Person", ["SetName", "SetAge", "GetName", "GetAge","GetCount"]);      var Man = (function () {          var count = 0;          return function (newname, newage) {              var name, age;              this.SetName = function (newname) { name = newname; }              this.SetAge = function (newage) { age = newage; }              this.GetName = function () { return name; }              this.GetAge = function () { return age; }              this.GetCount = function () { return count; }              this.SetAge(newage);              this.SetName(newname);              count++;          }      })();          Man.prototype.DisplayAll = function () { return "Name: " + this.GetName() + "; Age: " + this.GetAge() }          var Alan1 = new Man("Alan", 25);          var Alan2 = new Man("Alan", 25);     alert("There are "+Alan2.GetCount()+" instances of Man" );

Whether we use Alan1 or Alan2 to GetCount, the results are the same. 2. Here, count is a private static variable.