【问题标题】:Manually Invoke IIFE手动调用 IIFE
【发布时间】:2015-11-20 11:00:12
【问题描述】:

我有一个库 (Hubspot Odometer),我在我正在开发的 Web 应用程序中使用它,它可以很好地在页面上创建和运行 Odometer 样式的小部件。

问题在于它们是仪表板界面的一部分,该界面具有通过 AJAX 加载的窗格。初始视图不是通过 AJAX 加载的,因此 JavaScript 可以正常执行,并且里程表可以正确呈现。

当我加载一个带有里程表的新窗格时,它们没有正确呈现,也没有按应有的方式运行。原因是里程表库作为一个大型 IIFE 运行。

我想知道的是,我可以在通过 AJAX 加载内容后手动重新调用 IIFE,以便正确渲染并绑定里程表吗?

如果它为我提供了任何其他选项,我也在使用 jQuery。

【问题讨论】:

    标签: javascript function iife


    【解决方案1】:

    试试这个:

    var funcName = (function funcName() {
      // rest of the code
      return funcName;
    }());
    

    另见jsbin

    【讨论】:

      【解决方案2】:

      IIFE 的整体理念是它是一个立即执行的匿名函数。所以根据定义,没有没有办法重新执行它。

      话虽如此,您可以将函数表达式存储到全局变量中,然后执行它。例如

      window.my_iife = (function() { /* stuff */ });
      window.my_iife();
      

      注意语法与传统 IIFE 的细微差别:((function() {})());

      通过将函数存储在window 中,您可以稍后从开发人员控制台或代码中的任何其他位置访问它。如果您只是将它存储在var 中,或者将其声明为function my_iife() { /* ... */ } 某处,那么您将面临var 或函数声明本身被包装在IIFE 中从而无法访问的风险。例如,如果您在其中声明 var/function 的文件是 Sprockets 清单的一部分(例如 Rails 中的 application.js),则可能会发生这种情况。

      【讨论】:

      • 第 1 行括号的意义何在?与function my_iffe() { } my_iffe(); 相比,您的方法有什么优势?
      • 主要是个人风格问题。使用我的方法时,您可以保证能够从开发人员控制台重新调用该函数,而不是在其他闭包中丢失它。 OP 确实提到他想“手动”调用它。
      • 括起来的括号什么都不做,它只是分配一个由函数表达式创建的函数。
      • 就像我之前所说的,它避免了命名函数声明可能卡在另一个闭包中并且无法从开发者控制台访问或以其他方式手动调用的问题。例如,如果他的函数是 Rails 中 Sprockets 链的一部分,则声明本身有可能被包装在 IIFE 中,并且 OPs 问题将循环往复。
      • 抱歉,我第一次错过了“可能在其他关闭中迷路”部分。我提出问题的目的不是为了启发我,而是鼓励您将这些信息添加到您的答案中。
      【解决方案3】:

      var funcName = null; 
      (funcName = function funcName() {
        // rest of the code
        return funcName;
      }());
      
      funcName();

      这对我有用

      【讨论】:

        猜你喜欢
        • 2013-05-31
        • 2019-09-17
        • 1970-01-01
        • 2021-04-24
        • 2016-12-24
        • 1970-01-01
        • 2013-08-17
        • 2015-08-04
        相关资源
        最近更新 更多