Question

我读了很多关于全局变量的不良做法，我理解其中的原因。然而，在某些情况下，它似乎更容易。所以这是我的理由和问题。

我有一些函数可以动画（实际上我使用的是Rico St. Cruz的query.transit plugIn）一堆元素如：

$element_1 = $("#element_1");
$element_2 = $("#element_2");
$element_3 = $("#element_3");
$element_4 = $("#element_4");

function animate_1()
{
    // do something with every element
    $element_1.transition( {…}, 100, 'easeOutSine' )
    $element_2.transition( {…}, 150, 'easeOutExpo' )
    $element_3.transition( {…}, 100, 'easeOutSine' )
    $element_4.transition( {…}, 200, 'easeOutBack' )
}

function animate_2()
{
    // do something with every element
    $element_1.transition( {…}, 100, 'easeOutSine' )
    $element_2.transition( {…}, 150, 'easeOutExpo' )
    $element_3.transition( {…}, 100, 'easeOutSine' )
    $element_4.transition( {…}, 200, 'easeOutBack' )
}

function animate_3()
{
    // do something with every element
    $element_1.transition( {…}, 100, 'easeOutSine' )
    $element_2.transition( {…}, 150, 'easeOutExpo' )
    $element_3.transition( {…}, 100, 'easeOutSine' )
    $element_4.transition( {…}, 200, 'easeOutBack' )
}

这是我现在的解决方案，它工作正常，但它使用元素作为全局变量，我的.js文件嵌入在我的页面结束后。如果全球变量是不好的做法，那么它会更好吗？我知道我可以在每个函数中定义选择器，因此重复相同的声明4次，这对我来说似乎很愚蠢。我期待着您对这个问题的反馈。

Answer 1

大多数当你可以通过将代码包装在立即执行的函数表达式中来避免污染全局名称空间：

(function() {

     // declare variables here
     var $_element_1 = ...;

     // use them here
     function animate_1() {
         ...
     }

     // register event handlers
     ...
 })();  // invoke the function

请注意，这些函数现在也是本地范围的，因此您无法从内联事件处理程序引用它们。这是件好事; - ）

全局存储查询选择器总是不好的做法？

1 个答案: