0

我承认我在 JavaScript 方面还很不成熟,而且每次我认为我得到它的时候,一些奇怪的曲线球都会让我马上离开,这并没有帮助。

我有一个类似这样的 js 文件:

(function (myiife, $) {

    var myArrayOfThings = [];    

    myiife.myFunction = function (id) {
        var cachedThing = myiife.getFromArray(id);
        if (cachedThing === null) {
            // get from server
        } else {
            // do something with cached item
        }
    };

    myiife.getFromArray = function (idToFind) {
        for (var i = 0, len = myArrayOfThings; i < len; i++) {
            if (myArrayOfThings[i].Id=== idToFind) {
                return myArrayOfThings[i]; // Return as soon as the object is found
            }
        }
        return null;
    };

}(window.myiife= window.myiife|| {}, jQuery));

真正让我困惑的是期望能够调用事物的正确方法。我想我真的不了解事情的范围,而且我很难说实话。

如果我想从页面调用 myFunction 是否应该看起来像这样?

onclick="myiife.myFunction(1)"

我已经阅读了有关范围的内容,但显然在我对这一切的理解中仍然缺少一些非常基本的东西。

从我看到的示例中,我看不到其他似乎必须在函数名称前面加上iife名称才能从页面执行事物的示例。

任何好的推荐阅读也将不胜感激。

4

1 回答 1

1

Javascript 中的全局范围(至少在浏览器中)是window. 所以你所做的是你已经附加myiife到 window 并myiffe有一个名为myFunction. 因此,如果您想从全局范围(即window)调用它,那么您当然需要指定myiffe.myFunction().

你可能已经看到其他人做的事情是这样的:

var myFunction = (function() {
    var counter = 0;
    return function() {
        counter++;
        console.log(counter);
    };
})()

他们有 IIFE 的地方会返回一些东西(在这种情况下是一个函数,在许多其他情况下人们会返回一个对象)。在这种情况下,因为myFunction是一个全局变量,他们可以用 just 来调用它myFunction()。他们通过 IIFE 取得的成果基本上是使counter变量私有化。只有 IIFE 内的东西可以访问它。

当然,如果你不在myFunctionIIFE 内部定义,那么它只是一个全局范围内的函数,可以直接从全局范围内调用。

 function myFunction() {
     // do something
 }

 myFunction();

但是对于您在事件处理程序中使用它的问题 - 更好的做法是首先不在您的 HTML 中内联您的事件处理程序,而是将其绑定到代码中。这为您提供了更大的灵活性、更清晰的分离和更可维护的代码。

于 2014-02-14T14:22:29.237 回答