1
,关于名字空间:
YUI
对于名字空间的实现,其实只是使用
YAHOO.namespace()
来创建对象。对于
YUI
而言就是创建了一个全局对象,
比如:
SINOSOFT={};
SINOSOFT.util={};
这样的方式来区别定义名称。
YAHOO.namespace()
方法源码:
// 其实返回什么不重要了,主要是已经创建了对象。
YAHOO.namespace = function() {
var a=arguments, o=null, i, j, d;
for (i=0; i<a.length; i=i+1) {
d=(""+a[i]).split(".");
o=YAHOO;
// YAHOO is implied, so it is ignored if it is included
for (j=(d[0] == "YAHOO") ? 1 : 0; j<d.length; j=j+1) {
o[d[j]]=o[d[j]] || {};
o=o[d[j]];
}
}
return o;
};
// 按照上面的方法,可以用两种方法来声明 YAHOO.namespace(“widget.util”);
//YAHOO.namespace(“widget ”,”util”);
|
2
,关于模块管理:
YUI
的架构设计相当的强大,将最底层的一些通用调用的函数封装一个文件里面
yahoo-dom-event.js
,并且将模块之间的依赖尽量控制在最少,且将一些不是很常用可是通用的函数放在
utility
模块里面。当使用某种特性的时候只需引入所需文件即可。
使用这样的方法来解决模块依赖问题。
因为
YUI
的名字空间是使用创建对象这样的方式来实现,就会出现这样一种情况。当使用多个版本的
YUI
框架的时候,可能覆盖了以前的方法。
所以就出现了
YAHOO.register()
这样的方法来进行控制且运行想要的代码。通过对
module
进行注册,注册的时候且同时保留模块的版本信息,来解决多个版本之间的冲突。
YUI
的框架信息以及浏览器信息都存在名字空间
YAHOO.env
中
YAHOO.register = function(name, mainClass, data) {
var mods = YAHOO.env.modules, m, v, b, ls, i;
if (!mods[name]) {
mods[name] = {
versions:[],
builds:[]
};
}
m = mods[name];
v = data.version;
b = data.build;
ls = YAHOO.env.listeners;
m.name = name;
m.version = v;
m.build = b;
m.versions.push(v);
m.builds.push(b);
m.mainClass = mainClass;
// 此处是模块注册的时候,顺便注册了其监听器
for (i=0;i<ls.length;i=i+1) {
ls[i](m);
}
// label the main class
if (mainClass) {
mainClass.VERSION = v;
mainClass.BUILD = b;
} else {
YAHOO.log("mainClass is undefined for module " + name, "warn");
}
};
|
YAHOO.env
数据结构
YAHOO.env = YAHOO.env || {
/**
* Keeps the version info for all YUI modules that have reported themselves
* @property modules
* @type Object[]
*/
modules: [],
/**
* List of functions that should be executed every time a YUI module
* reports itself.
* @property listeners
* @type Function[]
*/
listeners: []
};
|
学到一个编程的小技巧:
比如类似出现:
e=e?e:window.event;
这样的代码。
或者是
if(e==null)
e=window.event;
可以简化成e=e||window.event
以上个人浅见,有错误欢迎指正。
分享到:
相关推荐
源码分析对于开发者来说,不仅能帮助理解YUI的工作原理,还可以学习到优秀的编程实践,比如模块化设计、事件驱动编程、性能优化等方面的知识。通过研究YUI 3.1.2的非压缩源码,我们可以深入理解这个强大库的内部构造...
1. **源码结构与功能**:YUI Compressor的源码通常包含多个部分,如解析器、语法分析器、压缩引擎等。源码允许开发者深入理解其工作原理,对其进行定制或扩展以满足特定需求。例如,你可以修改压缩算法,优化特定...
**Yahoo JavaScript库 YUI源码详解** Yahoo User Interface (YUI) 是Yahoo公司推出的一款强大的JavaScript库,旨在帮助开发者构建高性能、可维护的Web应用程序。作为一款免费且开源的工具,YUI为开发者提供了丰富的...
在“yui3-master.zip”中,我们可以看到不同模块的源代码文件,如“build”目录下的“node”, “event”, “dom”等,这些都是YUI3的核心模块。 2. **事件系统** YUI3的事件系统是其强大功能之一,它允许开发者...
最后,通过模块加载器,如YUI的Loader模块,可以按需加载所需的模块,并且管理模块间的依赖关系。 YUI3还提供了一种特殊的模块类型,称为沙盒模块。这种模块运行在隔离的环境中,它对全局作用域的修改不会影响到...
这个例子突显了YUI强大的布局管理能力。在Web开发中,布局设计是至关重要的,YUI提供了一套完整的布局解决方案,如Grids CSS框架,可以轻松实现响应式设计,适应不同屏幕尺寸和设备。在这个例子中,左中右三个模块的...
它包含了一系列模块化的组件,覆盖了用户界面设计、事件处理、动画效果、数据管理等多个方面。YUI框架API为开发者提供了丰富的功能和强大的工具,使得前端开发变得更加高效。 1. **模块化设计** YUI的核心理念之一...
1. **模块化**:YUI采用AMD(Asynchronous Module Definition)模块加载机制,允许异步加载和依赖管理,使得代码组织清晰,便于维护。 2. **响应式设计**:YUI提供了响应式设计工具,如Grids布局系统,能根据屏幕...
1. **模块化设计**:YUI采用模块化的结构,允许开发者按需加载所需的组件,减少页面加载时间,提高性能。 2. **跨浏览器兼容性**:YUI经过精心设计,确保在主流浏览器上都能正常运行,包括IE、Firefox、Chrome、...
1. **模块系统**:YUI 3.8.1采用CommonJS规范,通过YUI.use()方法按需加载模块,降低初始页面加载时间。此外,还支持AMD(异步模块定义)模式,适应不同的开发需求。 2. **事件处理**:YUI提供了一套完整的事件系统...
3. **CSS样式工具**:YUI3包含了一套CSS工具,如样式类名管理器(YUI.addClass, YUI.removeClass等),这有助于在JavaScript中动态控制元素的样式。 4. **DOM操作**:YUI3提供了丰富的DOM操作接口,如查找元素(YUI...
YUI 2.6.0r2版本在当时的JavaScript社区中占有重要地位,它提供了大量的可重用模块,涵盖了DOM操作、事件处理、动画效果、Ajax交互、CSS样式管理、数据处理等多个领域。这个版本修复了之前的一些已知问题,增强了...
YUI的核心理念是模块化,允许开发者根据项目需求选择和组合不同的功能模块,以实现高效且轻量级的代码。 在"Yahoo YUI 插件库"中,我们通常会发现各种扩展和增强YUI核心功能的插件。这些插件可能涵盖以下方面: 1....
YUI3 引入了粒度更细的模块管理方式,通过异步 HTTP 请求加载模块、然后执行回调来加载和使用模块。现场有很多人提出疑问,大家无非关心的是“效率”二字。个人以为在现阶段,这种方式有一点激进,否能为广大用户所...
首先,YUI的命名空间管理是其重要特性之一。`namespace`方法允许开发者创建自定义的全局命名空间,避免变量冲突,确保代码的组织性和可维护性。例如,YUI会自动创建`widget`, `util`, `example`等基础命名空间,...
模块可以通过`YUI.use()`方法来加载,实现了代码的异步加载和依赖管理。 2. **事件系统**:YUI的事件处理机制强大且灵活,支持DOM事件、自定义事件以及事件委托,使事件绑定和解绑变得简单易行。 3. **DOM操作**:...
YUI的核心理念是模块化和可定制性。它允许开发者按需选择所需的组件,减少页面加载时间,提高性能。YUI包含了一系列的JavaScript和CSS组件,如事件处理、DOM操作、动画效果、数据管理、Ajax交互、表单验证等,覆盖...
YUI的设计非常注重模块化和可扩展性,开发者可以通过编写新的模块来扩展其功能。YUI的模块化结构使得代码组织清晰,易于维护。 **3. 文档和示例** YUI 2.7提供的文档详尽介绍了每个组件的用法,包括API参考、教程和...
- **YUI提供的javascript的文件引入**:了解如何正确引入YUI库及各个模块。 - **关于引入的版本**:选择合适的YUI版本以兼容不同的浏览器和特性。 - **关于引入的顺序**:确保按正确的顺序加载YUI组件,以避免...
YUI包含了丰富的组件,包括布局管理、事件处理、动画效果、Ajax交互、表单验证等,为开发者提供了强大的工具集,简化了Web开发流程。 **1. YUI的模块化设计** YUI采用了模块化的设计理念,允许开发者根据项目需求按...