JavaScript创建命名空间的多种玩法


本文摘自PHP中文网,作者逆旅行人,侵删。

2021040209194670972.jpg

JavaScript中全局变量经常会引起命名冲突,甚至有时侯重写变量也不是按照你想像中的顺序来的,所以为了避免全局变量名冲突,创建命名空间成为最优解。

1.通过闭包(Closure)和Object实现

在闭包中声明好所有变量和方法,并通过一个JSON Object返回公有接口:

1

2

3

4

5

6

7

8

9

10

11

12

13

var NameSpace = NameSpace || {};

 NameSpace.Hello = (function() {  

 //待返回的公有对象 

  var self = {};  

  //私有变量或方法  

  var name = 'world'

   //公有方法或变量  

   self.sayHello = function(_name) {   

    return 'Hello ' + (_name || name); 

     } ;  

     //返回的公有对象  

     return self;

}());

2.通过JSON对象创建Object,代码如下:

1

2

3

4

5

var NameSpace = NameSpace || {};

NameSpace.Hello = {     name: 'world'   , sayHello: function(_name) {  

  return 'Hello ' + (_name || this.name); 

   }

 };

3.通过函数(function)创建:(较为复杂)

这是一种比较常见的写法,通过声明一个function实现,函数里设置初始变量,公共方法写入prototype,如:

1

2

3

4

5

6

7

8

9

10

var NameSpace = NameSpace || {};

/* Function */

NameSpace.Hello = function() {  

    this.name = 'world';

};

NameSpace.Hello.prototype.sayHello = function(_name) {  

    return 'Hello ' + (_name || this.name);

};

var hello = new NameSpace.Hello();

hello.sayHello();

4.通过函数(function)创建:(较为简洁)

1

2

3

4

5

6

7

8

var NameSpace = NameSpace || {};

NameSpace.Hello = new function() {  

    var self = this;  

    var name = 'world';  

    self.sayHello = function(_name) {   

     return 'Hello ' + (_name || name); 

      };

 };

推荐:《2021年js面试题及答案(大汇总)》

以上就是JavaScript创建命名空间的多种玩法的详细内容,更多文章请关注木庄网络博客

相关阅读 >>

javascript如何表示空指针

javascript深入探索 websocket和http/2与sse +如何选择正确的路径!

理解js原型链,继承和promis

javascript介绍ajax加载单张图片展示进度的方法

javascript中的对象分为哪几类

javascript如何阻止事件冒泡和事件本身发生

javascript怎么将字符串转为boolean类型

javascript怎么设置字体颜色

使用这8个javascript库,可以更好地处理本地存储!!

javascript判断一个对象是否为数组的几种方法(总结)

更多相关阅读请进入《javascript》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...