JS框架设计之命名空间设计一种子模块
命名空间
1、种子模块作为一个框架的最开始,除了负责初始化框架的最基础部分。
2、种子模块作为框架的最开始,那么什么是种子框架的最开始呢?答案是IIFE(立即调用函数表达式);
IIFE(立即调用函数表达式)是现代Javascript框架最主要的基础设施,它像细胞膜一样包裹着整个框架,放置外部框架的变量污染。
3、众所周知,大多数框架在windows中立足是通过命名空间,基本上我们可以把命名空间看成是框架的名字,当然也有一些框架没有命名空间向Prototype.js,mootools等都有污染的问题,他的意义存在与整个执行环境的每个角落。
4、Javascript的一切都是基于对象的,而Javascript通过复合类型的对象来构建命名空间比如:function,regexp,object等,我们往一个对象上添加一个属性,而这个属性又是一个对象,而对这个对象我们又可以给他添加一个对象,通过这种方法我们可以有条不紊的构建我们的框架,用户想调用摸个方法就通过XX.YYY.ZZZZ()来调用。基本代码如下:
<script>
alert(typeof(typeof(Test)));//输出:string
alert(typeof(Test));//输出:undefined 字符串形式 //所以判断一个对象的类型用===并和要判断的对象的字符串形式进行比较
if(typeof(Test)==="undefined"){
Test={};
Test.Function={};
Test.Class={};
Test.Array={};
Test.JSONP=new Test.Class();
Test.XHR=new Test.Array();
}
</script>
5、众观各大类库的实现,一开始都是以一个全局变量作为命名空间,然后对这个全局变量进行扩展,如Base2的Base,jQuery的jQuery。
6、全局变量的污染
全局变量的污染主要分两类
(1)对js原生对象的污染、Prototype,mootools和Base2归为一类,Prototype的原理是对Javascript对象进行扩展,但是他没有考虑到和其他库的兼容性问题,在Prototype的基础上
,而且有点渊源的插件几乎都和Prototype有关,mootools是Prototype的升级版,更加的oo,全面复制其API,Base则想修复IE的bug,让IE拥有标准浏览器的API,因此也把很多的原生对象给污染了
(2)对原生对象几乎没有污染、向jQuery、YUI、EXT这些框架,YUI和EXT就是想上面给出代码那样,一叠罗汉的方式构建的,jQuery则另辟蹊径,他以选择器为向导,所以他的命名空间是一个函数,方便用户把css选择器字符串传进来,然后通过选择器引擎进行查找,最后返回一个jQuery实例。
7、jQuery(命名空间)多库共存问题
因为jQuery最初也是非常弱小的,它想人家使用自己的框架,他也想Prototype那样使用$符作为命名空间。所以通过noConflict()这个方法实现了多库共存问题的解决,具体参考本人jQuery多库共存解决方案
注意:这个方案只解决单文件js类库框架的多库共存问题,向EXT这类多文件js类库并不能解决
JS框架设计之命名空间设计一种子模块的更多相关文章
- JS框架设计之对象扩展一种子模块
对象扩展 说完了,对象的创建(框架的命名空间的创建)以及如何解决多库之间的命名空间冲突问题之后,接下来,就是要扩展我们的对象,来对框架进行扩展,我们需要一种新功能,将新添加的功能整合到我们定义的对象中 ...
- JS框架设计之主流框架的引入机制DomeReady一种子模块
DomReady其实是一种名为"DomContentLoaded"事件的名称,不过由于框架的需要,它与真正的DomContentLoaded有区别,在旧的JS书籍中m都会让我们把J ...
- js框架设计1.1命名空间笔记
借到了司徒正美的写的js框架设计一书,司徒大神所著有些看不太懂,果然尚需循序渐进,稳扎js基础之中. 第一张开篇司徒阐述了种子模块的概念 种子模块亦为核心模块,框架最先执行模块,司徒见解应包含:对象扩 ...
- 基于 Egg.js 框架的 Node.js 服务构建之用户管理设计
前言 近来公司需要构建一套 EMM(Enterprise Mobility Management)的管理平台,就这种面向企业的应用管理本身需要考虑的需求是十分复杂的,技术层面管理端和服务端构建是架构核 ...
- 游戏UI框架设计(一) : 架构设计理论篇
游戏UI框架设计(一) ---架构设计理论篇 前几天(2017年2月)看到一篇文章,国内王健林.马云等大咖们看好的未来十大最有"钱途"产业中,排名第一的就是"泛娱乐&qu ...
- 一行js弹窗代码就能设计漂亮的弹窗广告
接到一个设计需求,要求xmyanke在网站右侧挂一个弹窗广告宣传最近的活动,找了半天都没看到合适的,自己鼓捣了一行js弹窗代码就能设计漂亮的弹窗广告,来瞧一下,欢迎拍砖提意见,js弹窗广告代码如下: ...
- Robot Framework测试框架用例脚本设计方法
Robot Framework介绍 Robot Framework是一个通用的关键字驱动自动化测试框架.测试用例以HTML,纯文本或TSV(制表符分隔的一系列值)文件存储.通过测试库中实现的关键字驱动 ...
- .net core +codefirst(.net core 基础入门,适合这方面的小白阅读) 【我们一起写框架】领域驱动设计的CodeFirst框架(一)—序篇
.net core +codefirst(.net core 基础入门,适合这方面的小白阅读) 前言 .net core mvc和 .net mvc开发很相似,比如 视图-模型-控制器结构.所以. ...
- atitit.atiOrmStoreService 框架的原理与设计 part1 概述与新特性
atitit.atiOrmStoreService 框架的原理与设计 part1 概述与新特性 1. 新特性如下 支持生成sql在无数据库连接的情况下 2. Orm设计 主要的俩个以来service ...
随机推荐
- .NET基础 (18)特性
特性1 什么是特性,如何自定义一个特性2 .NET中特性可以在哪些元素上使用3 有哪几种方法可以获知一个元素是否申明某个特性4 一个元素是否可以重复申明同一个特性 特性1 什么是特性,如何自定义一个特 ...
- HDU2680 Choose the best route 2017-04-12 18:47 28人阅读 评论(0) 收藏
Choose the best route Time Limit : 2000/1000ms (Java/Other) Memory Limit : 32768/32768K (Java/Othe ...
- Hadoopd 单元测试-MPUnit
Apache 版: 官网:http://mrunit.apache.org 教程:https://cwiki.apache.org/confluence/display/MRUNIT/MRUnit+T ...
- yum反查某个命令或so库在哪个包里面
yum whatprovides "*/XXX.so.1"
- stringBuilder类的一些用法
对String对象进行处理的时候比如拼接.截取,会在内存中新建很多字符串对象.为了减少内存开支,可以使用StringBuilder类型. 创建StringBuiler实例: 用构造函数直接创建: St ...
- C++不存在从std::string转换为LPCWSTR的适当函数
LPCWSTR是什么类型呢? 看看如何定义的: typedef const wchar_t* LPCWSTR; 顾名思义就是: LPCWSTR是一个指向unicode编码字符串的32位指针,所指向字符 ...
- .net core 2.0 mvc 初步学习
mvc_study *:first-child { margin-top: 0 !important; } body>*:last-child { margin-bottom: 0 !impor ...
- 巧用网页开发者工具F12 审查、修改元素、去除广告、屏蔽遮罩
巧用网页开发者工具F12 审查.修改元素.去除广告.屏蔽遮罩 每当打开一个网页的时候,是否为页面有很多广告而烦恼:是否为要操作页面(例如观看超清视频),请先注册登录等等事情而麻烦:是否对网页加锁的视频 ...
- Cookie的创建与删除
Cookie 为 Web 应用程序保存用户相关信息提供了一种有用的方法.例如,当用户访问站点时,可以利用 Cookie 保存用户首选项或其他信息,这样,当用户下次再访问站点时,应用程序就可以检索以前保 ...
- E - More is better (并查集)
点击打开链接 Mr Wang wants some boys to help him with a project. Because the project is rather complex, th ...