JS沙箱模式实例分析


Posted in Javascript onSeptember 04, 2017

本文实例讲述了JS沙箱模式。分享给大家供大家参考,具体如下:

//SandBox(['module1,module2'],function(box){});
/*
*
*
* @function
* @constructor
* @param []  array   模块名数组
* @param callback function 回调函数
* 功能:新建一块可用于模块运行的环境(沙箱),自己的代码放在回调函数里,且不会对其他的个人沙箱造成影响
和js模块模式配合的天衣无缝
*
* */
function SandBox() {
  //私有的变量
  var args = Array.prototype.slice.call(arguments),
      callback = args.pop(),
      //模块可以作为一个数组传递,或作为单独的参数传递
      modules = (args && typeof args[0] == "string") ? args : args[0];
  //确保该函数作为构造函数调用
  if (!(this instanceof SandBox)) {
    return new SandBox(modules,callback);
  }
  //不指定模块名和“*”都表示“使用所有模块”
  if (!modules || modules[0] === "*") {
    for(value in SandBox.modules){
      modules.push(value);
    }
  }
  //初始化所需要的模块(将想要的模块方法添加到box对象上)
    for (var i = 0; i < modules.length; i++) {
      SandBox.modules[modules[i]](this);
    }
  //自己的代码写在回调函数里,this就是拥有指定模块功能的box对象
  callback(this);
}
 SandBox.prototype={
   name:"My Application",
   version:"1.0",
   getName:function() {
     return this.name;
   }
 };
/*
* 预定义的模块
*
* */
SandBox.modules={};
SandBox.modules.event=function(box){
  //私有属性
  var xx="xxx";
  //公共方法
  box.attachEvent=function(){
    console.log("modules:event------API:attachEvent")
  };
  box.dettachEvent=function(){
  };
}
SandBox.modules.ajax=function(box) {
  var xx = "xxx";
  box.makeRequest = function () {
  };
  box.getResponse = function () {
  };
}
SandBox(['event','ajax'],function(box){
  box.attachEvent();
})

运行效果截图:

JS沙箱模式实例分析

JS沙箱模式实例分析

更多关于JavaScript相关内容可查看本站专题:《javascript面向对象入门教程》、《JavaScript中json操作技巧总结》、《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript动画特效与技巧汇总》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
动态加载js、css等文件跨iframe实现
Feb 24 Javascript
JavaScript中的lastIndexOf()方法使用详解
Jun 06 Javascript
12种JavaScript常用的MVC框架比较分析
Nov 16 Javascript
基于jquery实现图片上传本地预览功能
Jan 08 Javascript
APP中javascript+css3实现下拉刷新效果
Jan 27 Javascript
基于javascript实现简单的抽奖系统
Apr 15 Javascript
Vue使用vue-cli创建项目
Sep 01 Javascript
jQuery选择器之属性筛选选择器用法详解
Sep 19 jQuery
Angular实现表单验证功能
Nov 13 Javascript
微信小程序实现评论功能
Nov 28 Javascript
利用原生JS实现data方法示例代码
May 28 Javascript
vue+echarts实现中国地图流动效果(步骤详解)
Jan 27 Vue.js
详解基于 axios 的 Vue 项目 http 请求优化
Sep 04 #Javascript
JS实现颜色的10进制转化成rgba格式的方法
Sep 04 #Javascript
利用yarn代替npm管理前端项目模块依赖的方法详解
Sep 04 #Javascript
JS实现匀加速与匀减速运动的方法示例
Sep 04 #Javascript
node-sass安装失败的原因与解决方法
Sep 04 #Javascript
使用MUI框架模拟手机端的下拉刷新和上拉加载功能
Sep 04 #Javascript
JS图片延迟加载插件LazyImgv1.0用法分析【附demo源码下载】
Sep 04 #Javascript
You might like
php设计模式之观察者模式的应用详解
2013/05/21 PHP
php用户注册信息验证正则表达式
2015/11/12 PHP
Symfony的安装和配置方法
2016/03/17 PHP
基于jquery的时间段实现代码
2012/08/02 Javascript
Js放到HTML文件中的哪个位置有什么区别
2013/08/21 Javascript
javascript操作table(insertRow,deleteRow,insertCell,deleteCell方法详解)
2013/12/16 Javascript
jquery处理json对象
2014/11/03 Javascript
JS实现很酷的EMAIL地址添加功能实例
2015/02/28 Javascript
JavaScript基于ajax编辑信息用法实例
2015/07/15 Javascript
javascript实现手机震动API代码
2015/08/05 Javascript
Hammer.js+轮播原理实现简洁的滑屏功能
2016/02/02 Javascript
JavaScript function函数种类详解
2016/02/22 Javascript
详解如何在Vue2中实现组件props双向绑定
2017/03/29 Javascript
详解vue-cli构建项目反向代理配置
2017/09/07 Javascript
vue 父组件调用子组件方法及事件
2018/03/29 Javascript
javascript实现简易计算器功能
2020/09/23 Javascript
[50:24]VGJ.S vs Pain 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/20 DOTA
Python之PyUnit单元测试实例
2014/10/11 Python
python计算方程式根的方法
2015/05/07 Python
django框架CSRF防护原理与用法分析
2019/07/22 Python
Python利用FFT进行简单滤波的实现
2020/02/26 Python
什么是Python中的顺序表
2020/06/02 Python
Python配置pip国内镜像源的实现
2020/08/20 Python
使用html2canvas.js实现页面截图并显示或上传的示例代码
2018/12/18 HTML / CSS
挪威手表购物网站:Klokker
2016/09/19 全球购物
来自南加州灵感的工作和娱乐服装:TravisMathew
2019/05/01 全球购物
经管应届生求职信
2013/11/17 职场文书
护士检查书
2014/01/17 职场文书
三查三看党性分析材料
2014/02/18 职场文书
大学生个人求职信
2014/06/02 职场文书
企业2014年度工作总结
2014/12/10 职场文书
拯救大兵瑞恩观后感
2015/06/09 职场文书
小学新课改心得体会
2016/01/22 职场文书
css height属性中的calc方法详解
2021/06/03 HTML / CSS
javascript实现计算器功能详解流程
2021/11/01 Javascript
PYTHON使用Matplotlib去实现各种条形图的绘制
2022/03/22 Python