Question

我有一个文件bg.js，其内容只是一个IIFE。我想从另一个文件中的另一个函数加载此文件/调用该函数。由于IIFE是匿名的（它是，对吗？）我无法通过名字来称呼它。我似乎必须加载整个文件，以便立即执行。

我已经完成了搜索并找到了很多关于IIFE是什么的教程和文档，但我没有看到如何从另一个范围执行一个。

如何从另一个javascript文件调用/加载一个IIFE的javascript文件？

更多信息 IIFE加载到我页面的页脚中。单击链接进行导航时，不会执行页眉和页脚脚本。页脚中的IIFE负责设置背景图像，因此我需要在perPageBindings()

中执行该功能

我认为我需要做的是从perPageBindings()

中正在执行的正文中的另一个函数调用IIFE

为了清晰起见而修改 我正在考虑两种选择：

只需将脚本标记从页脚移动到正文;或
给IIFE一个名称，使其不再是匿名的，然后从其他地方调用该命名函数

如果2是一个可行的选项，那么我想我会创建一个关于将IIFE转换为命名函数的新问题。

Answer 1

如果要访问该脚本，函数或属性中的某些内容，在匿名调用之后，您需要将该函数的某些内部暴露给可从全局范围访问的内容。

我并不是说您必须让您的函数将变量放入全局范围，尽管这是许多库所做的，并且UMD如果CommonJS所遵循的路径之一或AMD环境不可用。

您应该查看Revealing Module Pattern以获得更好的视角。

请考虑以下代码段：

(function(global){
    /*
     * This variable will stay "private" 
     * because it is scoped to the IIF
     */
    var someProp = "Hello World";

    /*
     * This property is effectively exposed 
     * because it is accessible through 
     * myLib.foxtrot below
     */
    var someOtherProp = "Hello to you too";

    var myLib = {
        foo: "bar",
        fiz: true,
        buzz: 1,
        foxtrot: someOtherProp
    };

    /*
     * myLib is now accessible through the 
     * global that we passed to the IIF below
     * at the point of calling with "window"
     */
    global.myLib = myLib;

}(window));

Answer 2

似乎你想要将这个函数定义在一些可重用的地方。如果要从页脚中调用，请在IIFE中调用可重用函数调用。这样它会立即在页脚中调用并调用你的函数，但你也可以在其他地方调用这个函数。

示例：

JS：

function setBackground () {
    // sets background and can be called whenever
}

HTML：

<footer>
    <script>
        (function () {
            setBackground();
        } ());
    <script>
</footer>

从另一个Javascript文件调用IIFE

2 个答案: