JavaScript学习笔记(二十二) 声明依赖

 声明依赖(Declaring Dependencies)

JavaScript类库通常都是模块化和使用命名空间的，这样可以让你只包含你需要的模块。比如：在 YUI2有一个全局变量 YAHOO，作为一个命名空间，然后模块作为全局变量的属性，比如YAHOO.util.Dom(DOM模块)和 YAHOO.util.Event(Event模块)。

在你的函数或者模块的顶部是声明你的代码需要依赖哪些模块最好的地方。这个声明包括创建一个局部变量，并将它们指向你需要的模块:

var myFunction = function () {
    // dependencies
    var event = YAHOO.util.Event,
        dom = YAHOO.util.Dom;
    // use event and dom variables
    // for the rest of the function...
};

这是个极其简单的模式，但同时它也有一些好处：

• 明确的依赖声明可以向你的代码的使用者表明这些特殊的脚本文件需要被确保包含进页面
• 在函数头部的声明解，让发现和处理依赖关系更加简单
• 使用局部变量(比如:dom)通常比使用全局变量(比如:YAHOO)快，比访问全局对象的属性(比如:YAHOO.util.Do)更快，可以得到更好的性能，全局符号只会在函数中出现一次，然后就可以使用局部变量，后者速度更快。
• 高级压缩工具比如YUICompressor 和 Google Closure compiler会重命名局部变量，产生更小的体积的代码，但从来不会重命名全局变量，因为那样是不安全的

下面这段代码是为了说明声明依赖在压缩代码方面的影响。虽然 test2()遵循了模式，虽然看起来复杂些，因为它需要更多的行数和额外的变量，但在压缩后，它实际上产生了更少的用户不得不下载的代码。

function test1() {
    alert(MYAPP.modules.m1);
    alert(MYAPP.modules.m2);
    alert(MYAPP.modules.m51);
}
/*
minified test1 body:
alert(MYAPP.modules.m1);alert(MYAPP.modules.m2);alert(MYAPP.modules.m51)
*/
function test2() {
    var modules = MYAPP.modules;
    alert(modules.m1);
    alert(modules.m2);
    alert(modules.m51);
}
/*
minified test2 body:
var a=MYAPP.modules;alert(a.m1);alert(a.m2);alert(a.m51)
*/