命名空间

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框架设计之命名空间设计一种子模块的更多相关文章

  1. JS框架设计之对象扩展一种子模块

    对象扩展 说完了,对象的创建(框架的命名空间的创建)以及如何解决多库之间的命名空间冲突问题之后,接下来,就是要扩展我们的对象,来对框架进行扩展,我们需要一种新功能,将新添加的功能整合到我们定义的对象中 ...

  2. JS框架设计之主流框架的引入机制DomeReady一种子模块

    DomReady其实是一种名为"DomContentLoaded"事件的名称,不过由于框架的需要,它与真正的DomContentLoaded有区别,在旧的JS书籍中m都会让我们把J ...

  3. js框架设计1.1命名空间笔记

    借到了司徒正美的写的js框架设计一书,司徒大神所著有些看不太懂,果然尚需循序渐进,稳扎js基础之中. 第一张开篇司徒阐述了种子模块的概念 种子模块亦为核心模块,框架最先执行模块,司徒见解应包含:对象扩 ...

  4. 基于 Egg.js 框架的 Node.js 服务构建之用户管理设计

    前言 近来公司需要构建一套 EMM(Enterprise Mobility Management)的管理平台,就这种面向企业的应用管理本身需要考虑的需求是十分复杂的,技术层面管理端和服务端构建是架构核 ...

  5. 游戏UI框架设计(一) : 架构设计理论篇

    游戏UI框架设计(一) ---架构设计理论篇 前几天(2017年2月)看到一篇文章,国内王健林.马云等大咖们看好的未来十大最有"钱途"产业中,排名第一的就是"泛娱乐&qu ...

  6. 一行js弹窗代码就能设计漂亮的弹窗广告

    接到一个设计需求,要求xmyanke在网站右侧挂一个弹窗广告宣传最近的活动,找了半天都没看到合适的,自己鼓捣了一行js弹窗代码就能设计漂亮的弹窗广告,来瞧一下,欢迎拍砖提意见,js弹窗广告代码如下: ...

  7. Robot Framework测试框架用例脚本设计方法

    Robot Framework介绍 Robot Framework是一个通用的关键字驱动自动化测试框架.测试用例以HTML,纯文本或TSV(制表符分隔的一系列值)文件存储.通过测试库中实现的关键字驱动 ...

  8. .net core +codefirst(.net core 基础入门,适合这方面的小白阅读) 【我们一起写框架】领域驱动设计的CodeFirst框架(一)—序篇

    .net core +codefirst(.net core 基础入门,适合这方面的小白阅读)   前言 .net core mvc和 .net mvc开发很相似,比如 视图-模型-控制器结构.所以. ...

  9. atitit.atiOrmStoreService 框架的原理与设计 part1  概述与新特性

    atitit.atiOrmStoreService 框架的原理与设计 part1  概述与新特性 1. 新特性如下 支持生成sql在无数据库连接的情况下 2. Orm设计 主要的俩个以来service ...

随机推荐

  1. 网络排错与网络命令的理解ping-traceroute-host(nslookup)-tcpdump获取对方的mac

    1.  虚拟机中NAT架构的网络结构中, 虚拟网卡VMnet8(192.168.134.1)是连接宿主主机. 用虚拟网段中主机(192.168.134.133),ping  VMnet8 为什么没有响 ...

  2. MFC中的一般经验之谈----OnInitialUpdate

    在MFC程序设计中,按照传统的设计,如果处理WM_PAINT消息,一般会派生一个OnPaint函数,映射到WM_PAINT消息上进行绘图处理.但是很多程序中并没有出现OnPaint,一个OnDraw函 ...

  3. Jmeter-Ant 生成测试报告

    一.安装jmeter 配置环境变量 JMETER_HOME D:\SProgram\jmeter CLASSPATH %JMETER_HOME\lib\ext\ApacheJMeter_core.ja ...

  4. 6、Docker Image

    6.1 什么是image 文件和meta data的集合(root filesystem) 分层的,并且每一层都可以添加.改变.删除文件,成为一个新的image 不同的image可以共享相同的laye ...

  5. [label][Apache] VirtualHost

    <VirtualHost *:80>    ServerName   localhost    DocumentRoot "D:\www"</VirtualHos ...

  6. 12.1.2: How to Modify and Enable The Configurable Home Page Delivered Via 12.1.2 (Doc ID 1061482.1)

    In this Document   Goal Solution References       APPLIES TO:    Oracle Applications Framework - Ver ...

  7. Centos 下安装tomcat多实例

    基础环境及JDK就不多说了,下面的目录结构以如下为准: 根目录-apps根目录-apps--tomcat根目录-apps--ins1根目录-apps--ins2 =================== ...

  8. Linq使用中的ToList注意事项

    在使用Linq时,如果查询逻辑太复杂,可以拆分为多个Linq查询,下一个Linq在上一个Linq查询的结果上继续操作,这样逻辑清晰,又不会出错.但在使用ToList的时候需要注意,最常见碰到的错误是: ...

  9. JS 浏览器对象

    1.window对象 1.1 window对象 window对象是BOM的核心.window对象指当前的浏览器窗口 所有JavaScript全局对象 .函数以及变量均自动成为window对象的成员 全 ...

  10. @Configurable

    spring的一个注解,用来自动注入bean的注解,不需要通过BeanFactory去获取