引子

上一篇说了模块模式,而对于其中的命名空间模式其实也是有着一些问题,比如每添加一个模块或则深入叠加都会导致长命名,并且对于多个库的不同版本同时运行,一不小心就会污染全局标识,而这两天也发现了JSer对此也有解决办法,由于不是特别喜欢这种模式,但是在YUI3中大量的用到了这种模式,顾从网上扒了一篇来说明一下,这种模式就是沙箱模式。

什么是沙箱模式

沙箱模式(Sandbox Pattern),顾名思义沙箱模式是创建了一个"沙箱",可以理解为创建了一个黑盒,我们不管在里面做什么都不会影响到外面。而在JavaScript中就意味着,在沙箱中的操作被限死在当前作用域,不会对其他模块和个人沙箱造成任何影响。

具体实现

废话不多说。我们来看看沙箱模式的具体实现,如下代码所示:

```javascript
function Sandbox() {
var args = Array.prototype.slice.call(arguments),
callback = args.pop(),
modules = (args[0] && typeof args[0] === "string") ? args : args[0],
i;
if (!(this instanceof Sandbox)) {
return new Sandbox(modules, callback);
}
this.a = 1;
this.b = 2;
if (!modules || modules === '*') {
modules = [];
for (i in Sandbox.modules) {
if (Sandbox.modules.hasOwnProperty(i)) {
modules.push(i);
}
}
}
for (i = 0; i
  • 存在一个类型检查语句,检查this是否为Sandbox的实例,如果为否,则是忽略了new的调用,那么我们会再次以构造函数的形式调用该函数
  • 所需的模块可以通过数组的形式传递,或者单个参数传递,也可以通过通配符*的形式传递。
  • 该构造函数的最后一个参数是一个回调函数。该回调函数将会在使用新创建的实例时最后被调用。这个回调函数实际上就是我们所用的沙箱,它获得了一个填充了所需功能的box对象。

应用场景

当然我们最关心的还是沙箱模式主要应用在哪些场景,下面是沙箱模式几个经典的应用场景:
```javascript
//使用new操作符
new Sandbox(function(box) {
console.log(box);
})
//忽略new操作符的方法
Sandbox(['ajax', 'event'], function(box) {
console.log(box);
})
//直接传单个参数
Sandbox('ajax', 'dom', function(box) {
console.log(box);
})
//Sandbox的嵌套
Sandbox('dom', 'event', function(box) {
//一些代码
Sandbox('ajax', function(box) {
//这里的box和外部对象的box并不相同
})
})
```

从上面的代码可以发现沙箱模式可以通过将代码包装到回调函数中从而保护全局命名空间,而且他依赖注入的方式也很好的说明了他需要哪些模块,清晰了整个代码的结构。

添加模块

沙箱模式可以通过对构造函数添加静态属性来扩展模块

```javascript
Sandbox.modules={};
Sandbox.modules.dom=function(box){
box.getElement=function(){};
box.getStyle=function(){};
box.foo="bar";
}
Sandbox.modules.event=function(box){
box.attachEvent=function(){};
box.dettachEvent=function(){};
}
Sandbox.modules.ajax=function(box){
box.makeRequest=function(){};
box.getRequest=function(){};
}
```

结语

从哪搬得砖

  • http://www.microsoft.com/en-GB/developers/articles/scalable-javascript-application-architecture
  • http://www.g7blogs.com/
  • http://snipplr.com/view/60088/

初涉JavaScript模式 (12) : 沙箱模式的更多相关文章

  1. JavaScript设计模式-12.门面模式

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  2. 初涉JavaScript模式系列 阶段总结及规划

    总结 不知不觉写初涉JavaScript模式系列已经半个月了,没想到把一个个小点进行放大,竟然可以发现这么多东西. 期间生怕对JS的理解不到位而误导各位,读了很多书(个人感觉JS是最难的oo语言),也 ...

  3. 关于javascript的沙箱模式以及缓存方法

    在javascript函数代码中,经常会不经意出现全局变量,很可能造成对全局对象的污染,由于这种弊端的存在,那么沙箱模式油然而生.沙箱模式又称为沙盒模式.隔离模式.在js中只有函数可以限定变量作用域, ...

  4. 初涉JavaScript模式 (11) : 模块模式

    引子 这篇算是对第9篇中内容的发散和补充,当时我只是把模块模式中的一些内容简单的归为函数篇中去,在北川的提醒下,我才发觉这是非常不严谨的,于是我把这些内容拎出来,这就是这篇的由来. 什么是模块模式 在 ...

  5. 初涉JavaScript模式 (7) : 原型模式 【三】

    组合使用构造函数模式和原型模式 上篇,我们提到了原型模式的缺点,就是每个实例不能拥有自己的属性,因为纯原型模式所有的属性都是公开给每个实例的,故我们可以组合使用构造函数模式和原型模式.构造函数用来定义 ...

  6. 初涉JavaScript模式 (5) : 原型模式 【一】

    什么是原型模式? 原型模式(prototype)是指用原型实例指向创建对象的种类,并且通过拷贝这些原型创建新的对象.--引自JavaScript设计模式 我们创建的每一个函数都有一个prototype ...

  7. 初涉JavaScript模式 (4) : 构造函数

    什么是构造函数? 构造函数 是一种特殊的方法 主要用来在创建对象时初始化对象 即为对象成员变量赋初始值,总与new运算符一起使用在创建对象的语句中 特别的一个类可以有多个构造函数 可根据其参数个数的不 ...

  8. javascript沙箱模式

    沙箱模式解决了命名空间模式的如下几个缺点: 1.对单个全局变量的依赖变成了应用程序的全局变量依赖.在命名空间模式中,是没有办法使同一个应用程序或库的2个版本运行在同一个页面中.2.对这种以点分割的名字 ...

  9. 读书笔记之 - javascript 设计模式 - 享元模式

    本章探讨另一种优化模式-享元模式,它最适合于解决因创建大量类似对象而累及性能的问题.这种模式在javascript中尤其有用,因为复杂的javascript代码很快就会用光浏览器的所有可用内存,通过把 ...

随机推荐

  1. 图论(2-sat):Priest John's Busiest Day

    Priest John's Busiest Day   Description John is the only priest in his town. September 1st is the Jo ...

  2. 使用yum快速升级CentOS 6.5内核到 3.10.28

    网上有不少升级CentOS内核的文章,如<CentOS 6.5 升级内核到 3.10.28>,大部分都是下载源码编译,有点麻烦. 在yum的ELRepo源中,有mainline(3.13. ...

  3. 动态规划——G 回文串

    G - 回文串 Time Limit:3000MS     Memory Limit:65536KB     64bit IO Format:%I64d & %I64u Submit Stat ...

  4. [Locked] Shortest Word Distance I & II & III

    Shortest Word Distance Given a list of words and two words word1 and word2, return the shortest dist ...

  5. 更新一波题解(最近做的三个dp题)

    很久没写题解了,去ec之前来填一填坑,希望能攒攒人品... 首先是去年上海F题..uvalive7143 题意: 给n个人分 m间房子,每个房间的容量是已知的,其中有k对双胞胎,双胞胎可以看作相同的人 ...

  6. [置顶] VC++界面编程之--使用分层窗口实现界面皮肤

    使用分层界面来实现界面皮肤的好处是:可以保证图片边缘处理不失真,且能用于异形窗口上,如一些不规则的窗口,你很难用SetWindowRgn来达到理想效果. 在很多情况下,界面的漂亮与否,取决于PS的制作 ...

  7. 禁止执行某些讨厌的程序,如tadb.exe

    第一步:首先通过快捷键"Win+R"来打开"执行"菜单. 第二步:输入"gpedit.msc"回车确认,进入我们电脑中的组策略编辑器. 第三 ...

  8. Note | javascript权威指南[第六版] 第2章:词法结构

      语法结构规定了诸如变量名是什么样的.怎么写注释,以及程序语句之间如何分隔等规则.本章用很短的篇幅来介绍JavaScript的词法结构.   2.1.字符集   JavaScript程序是用Unic ...

  9. 站内信,群发与全部发送。Gson解析result

    /** * 发送站内信 */@Permission(Module.TZGL)@RequestMapping(value = "/sendznx", method = Request ...

  10. setValue:forUndefinedKey:]: this class is not key value coding-compliant for the key delete.的问题

    今天弄ios的sqlite数据库,程序写完后编译发现一个奇怪的问题,错误信息也不提示行号,只有如下信息: 一遍遍的查找代码也没有发现啥问题,后来在storyboard中找到了该错误的原因 原来是一个按 ...