1. 一场关于YUI3/jQuery的精彩辩论
正乐
2010.11.15

2. js框架百花齐放
Prototypejs,jQuery,YUI,Moontools,DOJO,kissy
……

3. YUI应当如何改进，以便更多的人来使用？
John Resig:和其他JS库相比，YUI的确很赞，但由于它的
域名分散、代码库过多且引入方式太多，这就导致了YUI
无法更多的去占领市场。
Nicholas C. Zakas:我承认，分散的站点的确是YUI的一个
问题，不止一个人曾经纠结于到底应该访问YDN呢还是
访问YUILibrary.com？这是YUI首先要解决的问题。同样，
John对于简化YUI文档首页上的引导信息的建议也相当不
错，是个好主意。

4. YUI如何提升才能改善和jQuery的竞争力？
John Resig: YUI项目本身依然存在着诸多结构性问题，需要改善.如
今，如果YUI直接和jQuery进行竞争，YUI和它的子项目的运作方式
都需要做出调整。因为现在的 YUI 项目运作方式与 YAHOO 的工作方
法是背道而驰的。鉴于目前的管理方式的极差的操作性，YUI项目
着实是一个不幸的牺牲品。
Nicholas C. Zakas:我不认为YUI和jQuery之间存在你死我活的竞争关
系.
jQuery更适合小网站使用，毕竟它很简单、大众、人人都可以快速
上手，因此jQuery有着庞大的设计师群体。对于可扩展的Web应用，
YUI的确更胜一筹。仅凭一个单一的产品很难满足所有用户多样化
的需求。jQuery在其专注的方面的确富有想象力，但YUI的关注点放
在解决复杂Web应用方面的问题上。

5. • John Resig:开源社区是YUI可持续发展的关键所在，它
会带来更多的反馈和热情的开发者，YUI的影响力也
在开源社区中潜移默化的影响这其中的每个人，
Yahoo 不应是其唯一的维护者，维护者应当来自于更
广阔的开源社区。
• 玉伯:我建议。Resig 的建议里，只有一个关键点：
Simplicity is key。并且很想传递出一个理念：Simplicity
is far harder to get right than building complex
applications。“简单比复杂更具挑战”，可惜Resig并
没有有效传递出来。的感觉，NCZ 并没有很好的领悟
到 John Resig 的

6. Observer
观察者 (Observer)又称订阅者.
有一个很多观察者都关心的对象,当这个对
象的状态发生变化时,这些观察者都会根据
对象发生的变化做出一定的反应.
被观察的对象不知道有多少人在观察自己,
观察者只知道他要关心对象的某一个或多
个变化.

7. 对象的属性,需要记下观察者委托
• var Subject = function(name,age){
• this._name = name;
• this._age = age;
• this.nameDelegates = [];
• this.ageDelegates = [];
• };

8. 对象需要提供给观察者开始观察的接口
• Subject.prototype = {
• addNameHandle:function(fn){
• this.nameDelegates.push(fn);
• },
• addAgeHandle:function(fn){
• this.ageDelegates.push(fn);
• },
• Name_OnChange:function(){
• for(var i=0; i<this.nameDelegates.length; i++){
• this.nameDelegates[i](this);
• }
• },
• Age_OnChange:function(){
• for(var i=0; i<this.ageDelegates.length; i++){
• this.ageDelegates[i](this);
• }
• },

9. • setName:function(name){
• this._name = name;
• this.Name_OnChange();
• },
• getName:function(){
• return this._name;
• },
• setAge:function(age){
• this._age = age;
• this.Age_OnChange();
• },
• getAge:function(){
• return this._age;
• }
• };

10. 观察者
• var Observe = function(number){
• var _number = number
• this.fnObserve = function(obj){
• console.log("观察者" + _number + "观察到对象的信
息变了,名字:" + obj.getName() + "年龄:" + obj.getAge());
• }
• };

11. 其他观察者
• var otherObserve = {
• subjectNameChange:function(obj){
• console.log("衰仔,又换名字了啊,名字看上去很傻:" +
obj.getName());
• },
• subjectAgeChange:function(obj){
• console.log("衰仔," + obj.getAge() + "岁了,老了?");
• }
• };

12. 调用方法
• var subject = new Subject("super man","12");
• var observe1 = new Observe(1);
• var observe2 = new Observe(2);
•
• subject.addNameHandle(observe1.fnObserve);
• subject.addAgeHandle(observe2.fnObserve);
•
• subject.addNameHandle(otherObserve.subjectNameChange);
• subject.addAgeHandle(otherObserve.subjectAgeChange);
•
• subject.setName("stupid man");
• subject.setAge(500);