Various ways to create namespaces in JavaScript-JS Tutorial-php.cn

Various ways to create namespaces in JavaScript

autoload

Release： 2021-04-02 09:45:46

Original

2078 people have browsed it

# In JavaScript global variables often cause Naming conflicts, and sometimes even rewriting variables are not in the order you imagined, so in order to avoid global variable name conflicts, creating a namespace becomes the optimal solution.

1. Implement through closure (Closure) and Object

Declare all variables and methods in the closure, and pass a

JSON Object Returns the public interface:

var NameSpace = NameSpace || {};
 NameSpace.Hello = (function() {   
 //待返回的公有对象  
  var self = {};   
  //私有变量或方法   
  var name = &#39;world&#39;;  
   //公有方法或变量   
   self.sayHello = function(_name) {    
    return &#39;Hello &#39; + (_name || name);  
     } ;   
     //返回的公有对象   
     return self; 
}());

Copy after login

2. Create Object through JSON object, the code is as follows:

var NameSpace = NameSpace || {}; 
NameSpace.Hello = {     name: &#39;world&#39;   , sayHello: function(_name) {   
  return &#39;Hello &#39; + (_name || this.name);  
   }
 };

Copy after login

3. Create through function: (more complex)

This is a relatively common way of writing, by declaring a

function is implemented, set the initial variables in the function, and write the public method into prototype, such as:

var NameSpace = NameSpace || {}; 
/* Function */ 
NameSpace.Hello = function() {   
    this.name = &#39;world&#39;; 
}; 
NameSpace.Hello.prototype.sayHello = function(_name) {   
    return &#39;Hello &#39; + (_name || this.name); 
}; 
var hello = new NameSpace.Hello(); 
hello.sayHello();

Copy after login

4. Create through function: (more Concise)

var NameSpace = NameSpace || {}; 
NameSpace.Hello = new function() {   
    var self = this;   
    var name = &#39;world&#39;;   
    self.sayHello = function(_name) {    
     return &#39;Hello &#39; + (_name || name);  
      }; 
 };

Copy after login

Recommended: "

2021 js interview questions and answers (large summary)"

The above is the detailed content of Various ways to create namespaces in JavaScript. For more information, please follow other related articles on the PHP Chinese website!