Understanding JavaScript Encapsulation _javascript Tips

Source: Internet
Author: User

Encapsulation can be defined as hiding the internal data representations and implementation details of an object. Information hiding can be enforced by encapsulation.

In JavaScript, there is no declaration of a private member's keyword, and so on. So in order to implement encapsulation/information hiding, we need to start from another way of thinking. We can use the concept of closures to create methods and properties that allow access only from within objects, to meet the requirements of encapsulation.

Basic Way
In general, we learn three ways to achieve encapsulation.

Use this. XXX to declare a variable, and then declare GetXXX, SETXXX, and other values, the method of assignment.
Use THIS._XXX to declare a variable, and then declare GetXXX, SETXXX, and so on, the method of assigning values.
Use the concept of "function scope" to do this.
1. Portal Open Type

var book = function (isbn,title,author) {
 this.setisbn (ISBN);
 This.settitle (title);
 This.setauthor (author);
};

Book.prototype = {
 setisbn:function (ISBN) {
  this.isbn = ISBN;
 },
 getisbn:function () {
  return THIS.ISBN
 },
 settitle:function (title) {
  this.title = title;
 },
 gettitle:function () { return
  this.title
 },
 setauthor:function (author) {
  this.author = author;
 },
 Getauthor:function () {return
  this.author;
 }
};

The encapsulation implemented using this method, although it implements the accessor and the assignment to protect the private property. But in practice, private properties can still be accessed from the outside, so fundamentally, no encapsulation is implemented.

2. Using naming conventions to differentiate

var book = function (isbn,title,author) {
 this.setisbn (ISBN);
 This.settitle (title);
 This.setauthor (author);
};

Book.prototype = {
 setisbn:function (ISBN) {
  this._isbn = ISBN;
 },
 getisbn:function () {
  return THIS._ISBN
 },
 settitle:function (title) {
  this._title = title;
 },
 gettitle:function () { return
  This._title
 },
 setauthor:function (author) {
  this._author = author;
 },
 Getauthor:function () {return
  this._author;
 }
};

Using this method is similar to the first, except that the use of different names is used to protect private properties. However, it still does not implement encapsulation from the practical application.

3. Using function scopes

var book = function (newisbn,newtitle,newauthor) {
 var isbn,title,author;

 This.setisbn=function (NEWISBN) {
  ISBN = newisbn;
 };
 This.getisbn=function () {return
  ISBN;
 };
 This.settitle=function (newtitle) {
  title = Newtitle;
 };
 This.gettitle=function () {return
  title;
 };
 This.setisbn=function (newauthor) {
  author = newauthor;
 };
 This.getisbn=function () {return
  author;}
 ;
}

Because variables declared in JavaScript functions are scoped, using this method avoids direct access to private properties externally. Basically reach the content required by the package.

The note here is that we can use this in the inside of the function. XXX and Var to declare variables. The difference is to use this. The variables declared by XXX are externally accessible. Variables declared with Var are not directly accessible outside the function because they are protected by the function scope.

4. Using function-scoped deformations

var book = (function () {
 //... Other static method return

 function (newisbn,newtitle,newauthor) {
  var isbn,title,author;

  This.setisbn=function (NEWISBN) {
   ISBN = newisbn;
  };
  This.getisbn=function () {return
   ISBN;
  };
  This.settitle=function (newtitle) {
   title = Newtitle;
  };
  This.gettitle=function () {return
   title;
  };
  This.setisbn=function (newauthor) {
   author = newauthor;
  };
  This.getisbn=function () {return author;};};}
) ();

This method returns the execution of a constructor directly. And the constructor here is an inline function.

The advantage of this approach is that "there is only one copy in memory." Because other static methods are declared outside the constructor, they are not privileged methods. ”

The principle of whether a method should be designed as a static method is "whether this method accesses a private property". If it doesn't, it's more efficient to design it as a static method because it will only be created.

Constant
We can implement constants using "only the accessor, no assignment".

1.
var book = function () {
 var constants = ["Key1": "1", "Key2": "2", "Key3": "3"];

 This.getconstant = function (key) {return
  Constants[key];
 }

; Book.getconstant ("Key1");

2.
var book = (function () {
 var constants = ["Key1": "1", "Key2": "2", "Key3": "3"];

 var con = function () {};
 Con.getconstant = function (name) {return
  constants[name];

 return con;
}) ();

Book.getconstant ("Key1");

Disadvantages
1. Lee Office

Encapsulation protects the integrity of the internal data;
Encapsulation makes it easier to refactor objects;
Weakening the coupling between modules to improve the reusability of objects;
Help avoid namespace conflicts;
......
2, the harm Department

Private methods are difficult to test;
It is necessary to deal with complex scope chain to make error scheduling more difficult;
Easy to form over encapsulation;
JavaScript does not natively support encapsulation, so the complexity of encapsulation in JavaScript is problematic;

The above is the entire content of this article, I hope to help you learn.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.