JS Create Class (Package)

JS How to create a class (encapsulation)

Have learned other object-oriented language Javascripter, may have applied classes, such as: class{}, and other definitions of a series of methods,
But beginners look at the time to learn JS, often see such a word, that is, JavaScript is object-oriented language, but no matter how they learn, are not very clear object-oriented programming, I am so, began to tangle JS object-oriented programming, these days is somewhat understood, Talk about my understanding of JS class ...

The so-called class, will have the following functions:

• Constructors
• Static properties, static methods
• Common attributes, common methods
• Private properties, Private methods

This article is about how to use JS to implement the encapsulation of classes, to achieve the above functions,

1. A simple class

var Person = function(name, age){    this.name = name; this.age = age; this.sayName = function(){ console.log(this.name); };}

How do you think TA is not like a class then you can do that

var Person = function(name, age){    //共有属性 this.name = name; this.age = age; //共有方法 this.sayName = function(){ console.log(this.name); };}

Hey... Here to make a treacherous look ...

If the constructor mode is not very clear, you can see here JS Create object design mode

2. A complex class

With the above example, we can do our perfect on this basis.

var person =function(name, age) {Common attributesTHIS.name = name;Common methodsThis.sayname =function() {Console.log (THIS.name); };Static private properties (only for internal calls)var home ="China";Static private methods (only for internal calls)functionSayhome () {Console.log (home);} //constructor this.setage = function12); this.setage (age);} //static method (accessible only by Class) Person.sayage =  Function () {Console.log ( "Your age is 12");} //static property (accessible only by Class) Person.drink =  "water"; function< Span class= "Hljs-params" > () {Console.log ( "Ys is a Boy");      

JS in the use of the above simulation method, the realization of the creation of the class, on this basis, we are uneasy about the status quo, want to encapsulate him, let him become a whole, more conducive to the embodiment of the packaging of JS.

3. Package JS class

Here we use closures to implement, first explaining the concept of closure.
Closure concept: One function has access to a variable in another function scope, that is, creating another function inside one function

The implementation is as follows:

var person = (function(){Static Private Property methodvar home ="China";functionSayhome(name) {Console.log (name +"' s home in" + Home);}constructor functionfunction_person(name, age) {var _this =ThisConstructor Safe mode to avoid losing the new keyword when creatingif (_thisInstanceof _person) {Common attributes, method _this.name = name; _this.gethome =function() { //internal access private property, Method Sayhome (_this.name);}; _this.test = Sayhome; //For test //Builder _this.setage = function(age) {_this.age = age + 12;} (age); }else{ return new _person (name, age);}} ///Static Common property Method _person.prototype = {constructor: _person, Drink: "Water", Sayword: function() { Console.log ("Ys is a Boy");}} return _person;}) ();

The call is as follows:

var P1=New Person ("Ys",12);p 1.gethome (); //ys ' s home in Chinaconsole. Log (P1.age); //24 var p2 = person (" ys ", 12);p 2.gethome (); //ys ' s home in Chinaconsole. Log (P2.age); //24 console. Log (P2.test == p1.test); //true, proof of static private variable sharing           

Like the code above, we use JS to implement the class

Summarize:

• Some public properties, methods, can be set to static, so that at each instantiation of the time, do not need to open up memory resources, to achieve a true sense of sharing,
• Some public property methods, which only want to be shared at the time of internal program processing, are set to the static private property method,
• Some public property methods, which want to achieve sharing in the instance object, are set to the prototype property method.

The class keyword is supported in the new ES6 syntax to encapsulate classes and inherit classes

Detailed view of the soft master's explanation: http://es6.ruanyifeng.com/#docs/class

JS Create Class (Package)