- 浏览: 1558620 次
- 性别:
- 来自: 北京
文章分类
最新评论
-
nich002:
原网站失效了。撸主简单粗暴的复制过来,可读性极差!差评!
Apache配置详解(最好的APACHE配置教程) -
107x:
不错,谢谢!
LINUX下查看文件夹下的文件个数! -
Hypereo:
好你妹,连个格式都没有!
Apache配置详解(最好的APACHE配置教程) -
resteater:
代码排版感觉有点乱!收发信息代码可读性不强!请问第一次发服务器 ...
java socket例子 -
resteater:
代码排版感觉有点乱!收发信息代码可读性不强!请问第一次发服务器 ...
java socket例子
From: http://www.blueidea.com/tech/web/2007/5169.asp
全局变量是魔鬼。在YUI中,我们仅用两个全局变量:YAHOO和YAHOO_config。YUI的一切都是使用YAHOO对象级的成员或这个成员作用域内的变量。我们建议在你的应用程序也使用类似的规则。
Douglas Crockford已经传授了一个有用的单例模式(singleton pattern)实现此规则,我认为他的模式有益于你基于YUI的那些应用。Douglas叫它模块模式(module pattern)。它是如下工作的:
1. 创建一个命名空间对象:如果你使用YUI,可以用YAHOO.namespace()方法:
YAHOO.namespace("myProject");
这分配了一个空的myProject对象,是YAHOO的一个成员(如 果myProject已存在的话,则不会被覆盖)。现在我们可以开始添加YAHOO.myProject的成员。
2. 对你的命名空间对象分配一个匿名函数返回值:
YAHOO.myProject.myModule = function () {
return {
myPublicProperty: "我作为YAHOO.myProject.myModule.myPublicProperty被访问。";
myPublicMethod: function () {
YAHOO.log("我作为YAHOO.myProject.myModule.myPublicMethod被访问。");
}
};
}(); // 这个括号导致匿名函数被执行且返回
注意有闭合大括号和紧接着的括号()的最后一行—这种符号导致了匿名函数的立即执行,返回包含myPublicProperty和myPublicMethod的对象。只要这个匿名函数一返回,返回对象就作为YAHOO.myProject.myModule被访问。
3. 在匿名函数中,在返回语句前加入“私有”方法和变量。到目前为止,我们只是将myPublicProperty和myPublicMethod直接分配到YAHOO.myProject.myModule中。此外,当我们在返回语句之前放置一些代码时,这个模式还支持被增加的效用。
YAHOO.myProject.myModule = function () {
//“私有”变量:
var myPrivateVar = “我仅能在YAHOO.myProject.myModule内被访问。”;
//私有方法:
var myPrivateMethod = function () {
YAHOO.log(”我仅能在YAHOO.myProject.myModule内被访问。”);
}
return {
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需要它们,我们的两个私有变量就不会被销毁。
4. 实践这个模式。让我们来看看这个模式的一个常见应用案例。假设你有一个列表,列表上的一些项可以被拖拽。应用拖拽的项上有拖拽的CSS类。
<!--这个脚本文件包含所有的YUI实用程序-->
<script type="text/javascript"
src="http://yui.yahooapis.com/2.2.2/build/utilities/
utilities.js"></script>
<ul id="myList">
<li class="draggable">一项</li>
<li>二项</li> <!--二项将不能被拖拽-->
<li class="draggable">三项</li>
</ul>
<script>
YAHOO.namespace("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 //限定搜索改元素的子
);
return aListItems;
};
//这个放回的对象将变成YAHOO.myProject.myModule:
return {
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(new YAHOO.util.DD(aListItems[i]));
}
}
};
}();
//上面的代码已经执行,所以我们能立即访问init方法:
YAHOO.myProject.myModule.init();
</script>
这是一个简单的例子,特意写的详细一些——如果按照这种方式做,我们无疑能把它写的更紧凑。当项目变得更加复杂和它的API增加,这个模式缩放的很好。通过这种方式,它避免了全局命名空间,提供了对外的可以访问的API方法,支持受保护或“私有”的数据和方法。
全局变量是魔鬼。在YUI中,我们仅用两个全局变量:YAHOO和YAHOO_config。YUI的一切都是使用YAHOO对象级的成员或这个成员作用域内的变量。我们建议在你的应用程序也使用类似的规则。
Douglas Crockford已经传授了一个有用的单例模式(singleton pattern)实现此规则,我认为他的模式有益于你基于YUI的那些应用。Douglas叫它模块模式(module pattern)。它是如下工作的:
1. 创建一个命名空间对象:如果你使用YUI,可以用YAHOO.namespace()方法:
YAHOO.namespace("myProject");
这分配了一个空的myProject对象,是YAHOO的一个成员(如 果myProject已存在的话,则不会被覆盖)。现在我们可以开始添加YAHOO.myProject的成员。
2. 对你的命名空间对象分配一个匿名函数返回值:
YAHOO.myProject.myModule = function () {
return {
myPublicProperty: "我作为YAHOO.myProject.myModule.myPublicProperty被访问。";
myPublicMethod: function () {
YAHOO.log("我作为YAHOO.myProject.myModule.myPublicMethod被访问。");
}
};
}(); // 这个括号导致匿名函数被执行且返回
注意有闭合大括号和紧接着的括号()的最后一行—这种符号导致了匿名函数的立即执行,返回包含myPublicProperty和myPublicMethod的对象。只要这个匿名函数一返回,返回对象就作为YAHOO.myProject.myModule被访问。
3. 在匿名函数中,在返回语句前加入“私有”方法和变量。到目前为止,我们只是将myPublicProperty和myPublicMethod直接分配到YAHOO.myProject.myModule中。此外,当我们在返回语句之前放置一些代码时,这个模式还支持被增加的效用。
YAHOO.myProject.myModule = function () {
//“私有”变量:
var myPrivateVar = “我仅能在YAHOO.myProject.myModule内被访问。”;
//私有方法:
var myPrivateMethod = function () {
YAHOO.log(”我仅能在YAHOO.myProject.myModule内被访问。”);
}
return {
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需要它们,我们的两个私有变量就不会被销毁。
4. 实践这个模式。让我们来看看这个模式的一个常见应用案例。假设你有一个列表,列表上的一些项可以被拖拽。应用拖拽的项上有拖拽的CSS类。
<!--这个脚本文件包含所有的YUI实用程序-->
<script type="text/javascript"
src="http://yui.yahooapis.com/2.2.2/build/utilities/
utilities.js"></script>
<ul id="myList">
<li class="draggable">一项</li>
<li>二项</li> <!--二项将不能被拖拽-->
<li class="draggable">三项</li>
</ul>
<script>
YAHOO.namespace("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 //限定搜索改元素的子
);
return aListItems;
};
//这个放回的对象将变成YAHOO.myProject.myModule:
return {
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(new YAHOO.util.DD(aListItems[i]));
}
}
};
}();
//上面的代码已经执行,所以我们能立即访问init方法:
YAHOO.myProject.myModule.init();
</script>
这是一个简单的例子,特意写的详细一些——如果按照这种方式做,我们无疑能把它写的更紧凑。当项目变得更加复杂和它的API增加,这个模式缩放的很好。通过这种方式,它避免了全局命名空间,提供了对外的可以访问的API方法,支持受保护或“私有”的数据和方法。
评论
2 楼
liudaoru
2010-07-20
http://hi.baidu.com/lijunliang/blog/item/45f6223fc1f4ebe155e7239b.html
高性能网页开发的14条军规
1. 尽可能的减少 HTTP 的请求数 [content]
2. 使用 CDN(Content Delivery Network) [server]
3. 添加 Expires 头(或者 Cache-control ) [server]
4. Gzip 组件 [server]
5. 将 CSS 样式放在页面的上方 [css]
6. 将脚本移动到底部(包括内联的) [javascript]
7. 避免使用 CSS 中的 Expressions [css]
8. 将 JavaScript 和 CSS 独立成外部文件 [javascript] [css]
9. 减少 DNS 查询 [content]
10. 压缩 JavaScript 和 CSS (包括内联的) [javascript] [css]
11. 避免重定向 [server]
12. 移除重复的脚本 [javascript]
13. 配置实体标签(ETags) [css]
14. 使 AJAX 缓存
高性能网页开发的14条军规
1. 尽可能的减少 HTTP 的请求数 [content]
2. 使用 CDN(Content Delivery Network) [server]
3. 添加 Expires 头(或者 Cache-control ) [server]
4. Gzip 组件 [server]
5. 将 CSS 样式放在页面的上方 [css]
6. 将脚本移动到底部(包括内联的) [javascript]
7. 避免使用 CSS 中的 Expressions [css]
8. 将 JavaScript 和 CSS 独立成外部文件 [javascript] [css]
9. 减少 DNS 查询 [content]
10. 压缩 JavaScript 和 CSS (包括内联的) [javascript] [css]
11. 避免重定向 [server]
12. 移除重复的脚本 [javascript]
13. 配置实体标签(ETags) [css]
14. 使 AJAX 缓存
1 楼
liudaoru
2007-12-11
自己做的小例子:
function Bwl() { } Bwl.t = function() { alert("cccc"); return {abc:"bbb",def:'sdfe'}; }(); alert(Bwl.t.abc);
发表评论
-
几个不错的ff下调试插件
2009-12-11 11:14 1821记录一下经常使用的ff插件,其中firebug、switchh ... -
20 种提升网页速度的技巧
2009-04-15 20:19 1203From:http://www.ibm.com/develop ... -
25 个在 Web 中嵌入图表的免费资源
2009-04-14 21:27 1621From: http://www.cnbeta.com/art ... -
15个网站用户体验优化禁忌
2009-04-08 22:57 1133From:http://www.blueidea.com/de ... -
让IE8兼容IE7
2009-03-27 15:10 3955今天在搜狐首页发现:<meta http-equiv ... -
FF下分析页面加载的工具
2009-03-25 16:03 2425今天同事推荐YSlow作为 ... -
IE6下页面显示空白的问题
2009-03-24 17:01 5271今天又碰到了一个页面在IE6下加载完后一片空白的问题,而且页面 ... -
支持IE6、IE7的关闭页面的函数
2009-03-17 15:40 1659function closeWin() { var isI ... -
很弱很无奈的一段代码(打开的页面更新父窗口的链接)
2009-03-12 11:51 993if(parent.window.opener) { pa ... -
js小脚本
2009-02-26 10:13 1502清除元素: var clearNode = functio ... -
处理一次性事件的模式
2009-02-12 20:20 1200有的时候我们需要给一个标签增加一次性的事件,比如先在输入框中增 ... -
Linux:rsync服务器的快速搭建和使用
2008-12-30 10:15 1281From: http://tech.ddvip.com/200 ... -
js导致的页面空白问题
2008-12-29 13:45 3076今天遇到一个很奇怪的问题,系统的一个页面在一台机器上无法完全展 ... -
IE6下history.back无效的问题
2008-12-26 23:56 3752解决IE6中history.back()无法返回的问题:< ... -
浏览器兼容比较好的设置min-width的方式
2008-12-12 18:45 2502<!DOCTYPE HTML PUBLIC " ... -
CSS代码分享:浏览器CSS Reset方法十例zz
2008-12-07 18:06 1115From: http://www.52css.com/arti ... -
在Javascript中,什么是闭包(Closure)
2008-12-02 11:11 1014from: http://javascript.chinaht ... -
Unicode、GB2312、GBK和GB18030中的汉字[转]
2008-11-25 15:22 3810From: http://blog.csdn.net/fmdd ... -
空字符串的split
2008-11-21 19:16 1531本来以为是零,但是在java和js里试了以后发现居然都是1,很 ... -
docType 相关的loose.dtd导致的无法获取scrollTop的解决
2008-11-19 11:32 1633function iecompattest(){ retu ...
相关推荐
JavaScript,是一种轻量级的解释型编程语言; jQuery,使用户能更方便地处理HTML documents、events、实现动画效果,并且方便地为网站提供AJAX交互; Bootstrap 是快速开发 Web 应用程序的前端工具包。它是一个 CSS...
JavaScript,是一种轻量级的解释型编程语言; jQuery,使用户能更方便地处理HTML documents、events、实现动画效果,并且方便地为网站提供AJAX交互; Bootstrap 是快速开发 Web 应用程序的前端工具包。它是一个 CSS...
JavaScript,是一种轻量级的解释型编程语言; jQuery,使用户能更方便地处理HTML documents、events、实现动画效果,并且方便地为网站提供AJAX交互; Bootstrap 是快速开发 Web 应用程序的前端工具包。它是一个 CSS...
JavaScript,是一种轻量级的解释型编程语言; jQuery,使用户能更方便地处理HTML documents、events、实现动画效果,并且方便地为网站提供AJAX交互; Bootstrap 是快速开发 Web 应用程序的前端工具包。它是一个 CSS...
JavaScript,是一种轻量级的解释型编程语言; jQuery,使用户能更方便地处理HTML documents、events、实现动画效果,并且方便地为网站提供AJAX交互; Bootstrap 是快速开发 Web 应用程序的前端工具包。它是一个 CSS...
#Platzom Platzom是为发明的一种语言##语言说明-如果单词以“ ar”结尾,则删除这两个字符-如果单词以“ z”开头,则在末尾添加“ pe”-如果翻译的单词有10个或更多字母,则必须在中间分开并在中间加上连字符-如果...
Platzom是为(在线教育的最佳场所)发明的一种语言。 它的设计旨在使您可以有趣地更改和学习新单词。 语言说明 -如果单词以“ ar”结尾,则删除这两个字符-如果单词以Z开头,则在末尾添加“ pe”-如果翻译后的单词...
4.7.11 z-index的相关问题以及Flash和IE 6下的select元素 4.7.12 插入png图片 4.7.13 多版本IE并存方案——CSS的调试利器IETester 第5章 高质量的JavaScript 5.1 养成良好的编程习惯 5.1.1 团队合作——如何...
神经网络方法是一种深度学习方法,它具有的非线性、自组织学习等优点很契合水质预测的问题。长短期记忆网络本身结构的特点,使其具有“记忆性”,这让它处理水质预测问题的准确度比其他方法更高。 【技术栈】 vue ...
让我们去看电影滚动条动画 P5.JS 使用 P5.JS quad() 在画布上绘制一... 模块原型JavaScript 通常被描述为一种基于原型的语言——为了提供继承,对象可以有一个原型对象,它作为一个模板对象,它从中继承了方法和属性。
由于我需要以一种干净且易于理解的方式跨不同模块使用输入字段的验证,所以它变得栩栩如生。 该库中提供的功能是: 验证格式: 数字字母数字按字母顺序(仅字母 a-zA-Z) 电子邮件必填项目可选字段可以添加自定义...
uid 微型(130B至205B)和...无论选择哪种“模式”,它也可以与任何汇总和Webpack配置一起使用。 安装 $ npm install --save uid 模式 uid共有三个“版本”: uid 大小(gzip): 174个字节可用性: , , 依赖Math
Chaos是一种强类型的,动态的但可编译的,面向测试的过程编程语言,可实现零循环复杂度。 被影响 TypeScript的类型安全 Python的语法,模块和可扩展性 JavaScript的跨平台支持 Ruby的循环和块,Rexx的FOREVER关键字...
Plusdb是一个开放源代码软件包,旨在为各种级别的初学者和人们提供一种简单的方法,以在中低容量的环境中访问和存储数据。 所有数据都永久存储在及其广泛的属性中。 安全性-它是开源的,您不必担心。 执行-无需...
开机画面现在有两种,一种为AMI公司开发的,一种为Phoenix-award两家公司合并共同开发的;下面这张图为Phoenix-award开机自画面: Phoenix-award workstation BIOS V6.00PC,An Energy star Ally copyright(c) 1984...
形状夹面向设计师的可变形显示器实现快速原型设计ShapeClip 是一种模块化工具,能够将任何计算机屏幕转换为 z 驱动的变形显示器。 这使设计师能够通过简单地将执行器“剪辑”到屏幕上来生成动态的物理形式。 ...
Windows XP(包括 Windows 2000)的控制台命令是在系统出现一些意外情况下的一种非常有效的诊断和测试以及恢复系统功能的工具。小编的确一直都想把这方面的命令做个总结,这次辛苦老范给我们整理了这份实用的秘笈。 ...
baseURL baseURL是一种简单的编码方案,其中每个字符代表64个值,这些值可在URL中安全工作,即(0-9a-zA-Z-_)。 每个ASCII字符编码6个二进制位。 输入的二进制数字必须可被6整除; 与base64不同,没有编码可变长度...
空气弹性 ... 一种独立的场景图表示形式,可对形状和瞬态(例如缩放级别或拖放阶段)进行建模 模拟数据,纯React DOM片段生成器和指针事件流水线,可在开发过程中进行可视化 灵感 是Marianela Ciolfi Felic
2012-06-11 21:01 12,345,799 基于FGPA的PCM编译码模块设计.zip 2012-06-11 21:06 3,769,694 基于LABVIEW编程环境的SQLSERVER ACCESS MYSQL 数据库的测试源代码.rar 2012-06-11 21:12 81,505 基于神经网络的文字识别...