javaScript NameSpace 简单说明介绍


Posted in Javascript onJuly 18, 2013

    打造JavaScript命名空间其实很简单,只需要将自己的函数、对象、变量等放在一个伪命名空间中,即用一个匿名函数包装起来。
 

(function(){ 
    function $(id){ 
        return document.getElementById(id); 
    } 
    function alertNodeName(id){ 
        alert($(id).nodeName); 
    } 
})();

    使用这种伪命名空间可以封装并保护自己的所有函数、对象、变量,而且由于他们位于一个函数之中,相互之间也可以互相访问。不过伪命名空间之外的脚本就无法使用这些函数了。
    为了使这些函数可以被伪命名空间之外的脚本调用,我们首先创建一个window对象。
(function(){ 
    if(!window.myNamespace){window['myNameSpace']={};} 
    function $(id){ 
        return document.getElementById(id); 
    } 
    function alertNodeName(id){ 
        alert($(id).nodeName); 
    } 
})();

    然后将要全局化的函数重命名一下(也可以不重命名)赋给window对象window['myNameSpace']。
(function(){ 
    if(!window.myNamespace){window['myNameSpace']={};} 
    function $(id){ 
        return document.getElementById(id); 
    } 
    function alertNodeName(id){ 
        alert($(id).nodeName); 
    } 
    window['myNameSpace']['showNodeName'] = alertNodeName; 
})();

    这样我们就打造了一个自己的命名空间。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<HTML> 
 <HEAD> 
  <TITLE> New Document </TITLE> 
  <META NAME="Generator" CONTENT="EditPlus"> 
  <META NAME="Author" CONTENT=""> 
  <META NAME="Keywords" CONTENT=""> 
  <META NAME="Description" CONTENT=""> 
  <SCRIPT LANGUAGE="JavaScript"> 
  <!-- 
 (function(){ 
  function $(id){ 
   return document.getElementById(id); 
  } 
  function alertNodeName(id){ 
   alert($(id).nodeName); 
  } 
  window['myNameSpace'] = {}; 
  window['myNameSpace']['showNodeName'] = alertNodeName; 
 })(); 
    function Test(){ 
  myNameSpace.showNodeName("T"); 
 } 
  //--> 
  </SCRIPT> 
 </HEAD> 
 <BODY onload="Test()"> 
   <INPUT TYPE="text" NAME="T" ID="T" VALUE="Test"> 
 </BODY> 
</HTML>
Javascript 相关文章推荐
JQuery1.4+ Ajax IE8 内存泄漏问题
Oct 15 Javascript
javascript数组去掉重复
May 12 Javascript
可简单避免的三个JS发布错误的详细介绍
Aug 02 Javascript
JS中的构造函数详细解析
Mar 10 Javascript
JavaScript基于setTimeout实现计数的方法
May 08 Javascript
深入浅析JavaScript的API设计原则
Jun 14 Javascript
详解Vue的computed(计算属性)使用实例之TodoList
Aug 07 Javascript
Vue2.0学习之详解Vue 组件及父子组件通信
Dec 12 Javascript
关于jquery中attr()和prop()方法的区别
May 28 jQuery
详解Vue依赖收集引发的问题
Apr 22 Javascript
ES6 Array常用扩展的应用实例分析
Jun 26 Javascript
jQuery实现本地存储
Dec 22 jQuery
JS获取鼠标坐标的实例方法
Jul 18 #Javascript
非常好用的JsonToString 方法 简单实例
Jul 18 #Javascript
转义字符(\)对JavaScript中JSON.parse的影响概述
Jul 17 #Javascript
JS随机生成不重复数据的实例方法
Jul 17 #Javascript
Javascript和HTML5利用canvas构建Web五子棋游戏实现算法
Jul 17 #Javascript
javascript和HTML5利用canvas构建猜牌游戏实现算法
Jul 17 #Javascript
js中如何把字符串转化为对象、数组示例代码
Jul 17 #Javascript
You might like
php 在文件指定行插入数据的代码
2010/05/08 PHP
PHP网页游戏学习之Xnova(ogame)源码解读(九)
2014/06/24 PHP
yii,CI,yaf框架+smarty模板使用方法
2015/12/29 PHP
IE6下JS动态设置图片src地址问题
2010/01/08 Javascript
Jquery 扩展方法
2010/05/06 Javascript
JS 控制小数位数的实现代码
2011/08/02 Javascript
ExtJS中文乱码之GBK格式编码解决方案及代码
2013/01/20 Javascript
纯JavaScript实现HTML5 Canvas六种特效滤镜示例
2013/06/28 Javascript
js复制网页内容并兼容各主流浏览器的代码
2013/12/17 Javascript
jquery中append()与appendto()用法分析
2014/11/14 Javascript
jQuery选择器用法实例详解
2015/12/17 Javascript
基于javascript编写简单日历
2016/05/02 Javascript
使用jQuery实现Web页面换肤功能的要点解析
2016/05/12 Javascript
一个有意思的鼠标点击文字特效jquery代码
2017/09/23 jQuery
用js编写留言板
2020/03/17 Javascript
[04:09]2018年度DOTA2社区贡献奖-完美盛典
2018/12/16 DOTA
Python的Flask框架应用程序实现使用QQ账号登录的方法
2016/06/07 Python
基于python3 pyQt5 QtDesignner实现窗口化猜数字游戏功能
2019/07/15 Python
在 Linux/Mac 下为Python函数添加超时时间的方法
2020/02/20 Python
python实现图片横向和纵向拼接
2020/03/05 Python
浅析Python 抽象工厂模式的优缺点
2020/07/13 Python
Pandas数据分析的一些常用小技巧
2021/02/07 Python
简单聊聊H5的pushState与replaceState的用法
2018/04/03 HTML / CSS
HTML5 实现一个访问本地文件的实例
2012/12/13 HTML / CSS
Html5插件教程之添加浏览器放大镜效果的商品橱窗
2016/01/07 HTML / CSS
梵蒂冈和罗马卡:Omnia Card Pass
2018/02/10 全球购物
越南综合购物网站:Lazada越南
2019/06/10 全球购物
Dogeared官网:在美国手工制作的珠宝
2019/08/24 全球购物
G-Form护具官方网站:美国运动保护装备
2019/09/04 全球购物
德国大型箱包和皮具商店:Koffer
2019/10/01 全球购物
新娘父亲婚礼致辞
2014/01/16 职场文书
货车司机岗位职责
2014/03/18 职场文书
创建青年文明号材料
2014/05/09 职场文书
党的群众路线教育实践活动心得体会(教师)
2014/10/31 职场文书
MySQL 全文索引使用指南
2021/05/25 MySQL
Python基本知识点总结
2022/04/07 Python