YUI 系统学习之一 基础架构

对javascript和YUI3的学习已经持续了10天，基本上掌握了YUI3的用法，打算陆续将YUI3的基础和体会写出来，以便于后期的界面开发

 

YUI3采用构件化的思想来搭建前台界面，核心思想就是组件widget

 

一、YUI3的层次

1、第一层核心层：包括YUI全局对象、事件、节点。  

             YUI全局对象包括YUI模块、oop模块，yui模块是一些最核心的javascript代码，这个模块也成为种子，主要用于加载其他模块和计算模块间的关系，同时模块中还包含很多常用类，相当于java的lang包一样。oop模块包含继承、合并、克隆等类。他们作为YUI的核心对上层模块提供支持。

            节点模块 node  ,他把DOM元素演化为node对象，对DOM元素进行包装有一些好处，风格一致的操作，能够让DOM元素结合YUI核心进行扩展，

             事件模块 event ，事件是核心，用途就是让对象和对象之间解耦合的交互。借助这个模块，我们能为每一个对象定义事件。在YUI3中，事件是冒泡传递的。

 

2、第二层基础层 base。 YUI3的思想是构件化编程，基础层为构件化提供基础类库，为构件化铺路搭桥，包括attribute 、base、baseplug

 

3、第三层构件层 widget。我们可以继承widget做构件了。widget综合了基础层的功能，为程序员提供了一个定制组件的模板。widget继承base，依赖node，让我们能把DOM元素，数据视图、逻辑等要素进行组件化。

 

二、YUI3的利弊。

利弊权衡，善用YUI3。

1、YUI3是出色的架构，但是过于复杂，反正我认真通读了文档，并通过部分练习才掌握，基础模块的繁多让文档非常庞大，学习过程非常艰难。

2、个人认为：YUI3应该把node和 widget统一，不应该有两个模块来表达一个概念，最好由事件、属性、插件等构成基础模块，舍弃base，整个构架会简单很多，且扩展会更加的强劲。反正我觉得只要是界面元素，不管他是可视的DOM元素，还是不可视的数据元素，都是构件，而不应该强调节点和构件两个概念，虽然意图是为了简化编码，但是对框架的使用者”程序员“来说，就是个噩梦的开始，也应该是YUI3很难受欢迎的原因吧。

3、YUI3提供了很多的构建（widget）、插件（基于base、baseplug的另外一类组件，用于组件切面化编程）。可以说我们用现成的就能够很好的解决实际的问题。真的是这样，我近期的项目，我分析了一下，界面基本上用YUI3现有的组件就能很好的表现了。

 

三、javascript语言基础，jquery和YUI3

1、要做界面，首先应该掌握javascript语言，要知道jquery和YUI3的核心模块是如何做出来的

2、jquery和YUI3是同质化化的东西，都是一种架构框架，只不过jquery较YUI更简洁，他相当于YUI的node模块。

3、我做过很多后台程序，做界面很少，感觉界面构件化更具挑战，像jquery和YUI3这些架构和背后的思想是很值得学习的，在此对这些架构师致敬