个有用
单例模式(singleton pattern)实现此规则
我认为他模式有益于你基于YUI那些应用
Douglas叫它模块模式(module pattern)它是如下工作: 创建
个命名空间对象:如果你使用YUI可以用YAHOO.
思路方法: YAHOO.("myProject");这分配了个空myProject对象是YAHOO个成员(如 果myProject已存在话则不会被覆盖)现在我们可以开始添加YAHOO.myProject成员 对你
命名空间对象分配个匿名
返回值: YAHOO.myProject.myModule = function
{ 
{ myPublicProperty: "我作为YAHOO.myProject.myModule.myPublicProperty被访问
"; myPublicMethod: function
{ YAHOO.log("我作为YAHOO.myProject.myModule.myPublicMethod被访问
"); }
};
}
; // 这个括号导致匿名被执行且返回 注意有闭合大括号和紧接着
括号最后行—这种符号导致了匿名立即执行返回包含myPublicProperty和myPublicMethod对象只要这个匿名返回返回对象就作为YAHOO.myProject.myModule被访问 在匿名
中在返回语句前加入“私有”思路方法和变量到目前为止我们只是将myPublicProperty和myPublicMethod直接分配到YAHOO.myProject.myModule中此外当我们在返回语句的前放置些代码时这个模式还支持被增加效用 YAHOO.myProject.myModule = function
{ //“私有”变量:
var myPrivateVar = “我仅能在YAHOO.myProject.myModule内被访问
”; //私有思路方法:
var myPrivateMethod = function
{ YAHOO.log(”我仅能在YAHOO.myProject.myModule内被访问
”); }
{ myPublicProperty: “我作为YAHOO.myProject.myModule.myPublicProperty能被访问
” myPublicMethod: function
{ YAHOO.log(”我作为YAHOO.myProject.myModule.myPublicMethod能被访问
”); //在myProject,我能访问私有
变量和思路方法 YAHOO.log(myPrivateVar);
YAHOO.log(myPrivateMethod
); //myPublicMethod
原生作用域是myProject我们可以用“this”来访问公共成员 YAHOO.log(this.myPublicProperty);
}
};
}
;在上面代码中我们从个匿名返回有两个成员个对象在YAHOO.myProject.myModule内部可以分别用this.myPublicProperty和this.myPublicMethod来访问在YAHOO.myProject.myModule外部公共成员可以用YAHOO.myProject.myModule.myPublicProperty和YAHOO.myProject.myModule.myPublicMethod来访问 私有变量myPrivateProperty和myPrivateMethod只能被匿名
本身或返回对象成员访问尽管匿名会立即执行和终止但它们依然是保留着凭借闭包(closure)力量——通过个局部变量在这个返回后是保留规则只要 YAHOO.myProject.myModule需要它们我们两个私有变量就不会被销毁 实战这个模式
让我们来看看这个模式个常见应用案例假设你有个列表列表上些项可以被拖拽应用拖拽项上有拖拽CSS类 <!--这个脚本文件包含所有
YUI实用
--> <script type="text/javascript"
src="http://yui.yahooapis.com/2.2.2/build/utilities/utilities.js"></script>
<ul id="myList">
<li
="draggable">项</li> <li> 2项</li> <!-- 2项将不能被拖拽-->
<li
="draggable"> 3项</li> </ul>
<script>
YAHOO.
("myProject"); YAHOO.myProject.myModule = function
{ //YUI实用
私有简写引用: var yue = YAHOO.util.Event,
yud = YAHOO.util.Dom;
//私有思路方法
var getListItems = function
{ // 注意这个地方使用其他
私有变量包括"yud"YAHOO.util.Dom简写: var elList = yud.get("myList");
var aListItems = yud.getElementsByClassName(
"draggable", //得到仅有CSS类"draggable"
项 "li", //仅返回列表项
elList //限定搜索改元素
子 );
aListItems; };
//这个放回
对象将变成YAHOO.myProject.myModule: { aDragObjects:
, //可对外访问存储DD对象 init: function
{ //直到DOM完全加载好
才实现列表项可拖拽: yue.onDOMReady(this.makeLIsDraggable, this, true);
},
makeLIsDraggable: function
{ var aListItems = getListItems
; //我们可以拖拽那些元素 for (var i=0, j=aListItems.length; i<j; i
) { this.aDragObjects.push(
YAHOO.util.DD(aListItems[i])); }
}
};
}
; //上面
代码已经执行所以我们能立即访问init思路方法: YAHOO.myProject.myModule.init
; </script>这是
个简单例子特意写详细些——如果按照这种方式做我们无疑能把它写更紧凑当项目变得更加复杂和它API增加这个模式缩放很好通过这种方式它避免了全局命名空间提供了对外可以访问API思路方法支持受保护或“私有”数据和思路方法 [1]原文:
a javascript module pattern
这是在YUI blog上有地方可能打不开可以搜下英文转载或者利用搜索引擎缓存Cache也能看 [2]
A JavaScript Module Pattern - JavaScript种模组模式这是别人翻译参考了不少不过感觉挺不方便看这是我翻译这篇文章个原因当然最主要原因是这篇文章算是学习YUI最基础文章了整个YUI模块模式都基于此
最新评论