命名空间

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. HDU 2044 一只小蜜蜂...(递推,Fibonacci)

    题意:中文题. 析:首先要想到达第 n 个蜂房,那么必须经 第 n-1 或第 n-2 个蜂房,那么从第 n-1 或第 n-2 个蜂房到达第 n 个,都各自有一条路线, 所以答案就是第 n-1 + 第 ...

  2. 第二周leetcode

    4/4 这周莫名得忙,一天是做编译,一天是做模式识别作业,(一天刷魔兽皮肤),周末玩了两天,总的来说还是松懈了,大概只做了两天的leetcode,刷了10道题,羞愧羞愧. 决定每次把代码附上在这个总结 ...

  3. CAS实战の自定义注销

    步骤一 在cas server端,设置/WebContent/WEB-INF/cas-servlet.xml: <bean id="logoutAction" class=& ...

  4. ASP.NET Core2基于RabbitMQ对Web前端实现推送功能

    在我们很多的Web应用中会遇到需要从后端将指定的数据或消息实时推送到前端,通常的做法是前端写个脚本定时到后端获取,或者借助WebSocket技术实现前后端实时通讯.因定时刷新的方法弊端很多(已不再采用 ...

  5. Java定时任务的实现

    本例依据Java自身提供的接口实现,通过监听器(Listener)和定时器(Timer)定时执行某个任务(Task).专业的开源工具可参考Quartz:http://www.opensymphony. ...

  6. sqlite批量处理数据性能优化

    最近设计到sqlite数据库批量操作的,性能很是问题.于是一番研究(站在巨人肩膀)从网上整理出来相关性能优化方向.大体分三个级别,一般第一个阶段已足够. 1.sqlite每次插入数据(每调用一次sql ...

  7. 注意力机制(Attention Mechanism)应用——自然语言处理(NLP)

    近年来,深度学习的研究越来越深入,在各个领域也都获得了不少突破性的进展.基于注意力(attention)机制的神经网络成为了最近神经网络研究的一个热点,下面是一些基于attention机制的神经网络在 ...

  8. JUC中Executor基本知识

    Future And Callable 引用 http://www.cnblogs.com/dolphin0520/p/3949310.html http://www.iocoder.cn/JUC/ ...

  9. js滚动距离

    滚动距离 onclick="$('html,body').animate({scrollTop:$('.J_user_evaluate').offset().top-110},500)&qu ...

  10. jmeter进行https协议的测试

    一.HTTPS和HTTP的区别     超文本传输协议HTTP协议被用于在Web浏览器和网站服务器之间传递信息.HTTP协议以明文方式发送内容,不提供任何方式的数据加密,如果攻击者截取了Web浏览器和 ...