在文档外使用函数的首选方法是什么?

时间:2015-02-06 16:16:14

标签: jquery

我知道我可以在文档就绪处理程序之外定义我的函数,然后像这样调用它:

function sayHello(){
  alert('hello');
}
  $(document).ready(function(){
    sayHello();       
  });

但我不确定这样做是否有 缺点

我也知道我可以使用如下命名空间来定义我的函数:

sayHi = {
  sayHello: function() {
      alert('hello');
  }
}
$(document).ready(function(){

sayHi.sayHello();    

});

我的第二个例子更好然后第一个或者可能还有更好的解决方案吗?

1 个答案:

答案 0 :(得分:2)

这方面的一些建议:

  1. 在尽可能小的范围内定义函数。因此,如果sayHi()仅在document.ready()内使用,则在document.ready()内定义}。

  2. 尽可能少地创建新的全局变量。如果必须在全局范围内定义多个内容,那么创建单个全局命名空间对象通常是一个好主意作为财产的其他全球性事物。

  3. 使用IIFE闭包来包装需要共享的代码。您可以通过将代码包装在IIFE(立即调用的函数表达式)中来共享大块代码中的函数,而无需创建任何全局变量。这实际上为您的大部分代码(甚至是所有代码)创建了一个新的函数范围,然后您可以在该范围内定义公共函数。大多数jQuery库都在其中一个闭包中。这也可以保护您的代码片段形成不受欢迎的外部访问。

  4. 始终使用var(或ES6中的let)明确声明您的变量。这样您就不会创建偶然的全局变量或隐式全局变量。

  5. 以严格模式运行。在严格模式下运行时,忘记使用varlet将触发您将立即看到的错误,因为隐含或偶然的全局变量在严格模式下是错误的。

  6. 在您的具体示例中,如果您还需要从sayHi()之外调用document.ready(),那么您可以使用IIFE来避免创建任何新的全局变量:


    (function() {
        function sayHi() {
            alert('hello');
        }
    
    
        $(document).ready(function() {
            sayHi();
        });
    
        // other code
        // ...
    
        sayHi();
    
    })();
    

    如果您不需要从sayHi()之外拨打document.ready(),那么只需在document.ready()内定义,如下所示:

    $(document).ready(function() {
        function sayHi() {
            alert('hello');
        }
    
        sayHi();
    });