准备好DOM的Javascript模块模式

Javascript Module pattern with DOM ready

本文关键字：模块 模式 Javascript DOM 准备好      更新时间：2023-09-26

我正在写一个JS模块模式来测试代码，并帮助我理解模式，使用JS提琴。我无法弄清楚的是为什么我的"私有方法"在第25行和26行，当通过DOM就绪引用时，有一个undefined的值。

JSFiddle

代码示例:

var obj = {
    key: "value"
};
var Module = (function () {
  var innerVar = "5";
  console.log("obj var in Module:");
  console.log(obj);
function privateFunction() {
    console.log("privateFunction() called.");
    innerFunction();
    function innerFunction() {
        console.log("inner function of (private function) called.");
    }
}
function _numTwo() {
    console.log("_numTwo() function called.");
}
return {
    test: privateFunction,
    numTwo: _numTwo
}

}(obj));

$(document).ready(function () {
    console.log("$ Dom Ready");
    console.log("Module in Dom Ready: ");
    console.log(Module.test());
});

您正在向控制台输出调用privateFunction的返回结果，在本例中没有返回结果。

...
function privateFunction() {
    console.log("privateFunction() called.");
    innerFunction();
    function innerFunction() {
        console.log("inner function of (private function) called.");
    }
    return 'not undefined :)';
}
...

控制台输出:

obj var in Module: (index):30
Object {key: "value"} (index):31
$ Dom Ready (index):57
Module in Dom Ready:  (index):58
privateFunction() called. (index):34
inner function of (private function) called. (index):38
not undefined :)

详细信息请参见更新后的jsFiddle

对象返回:

return {
    test: privateFunction(),
    numTwo: _numTwo()
}

你正在调用函数，你没有传递它的引用:)。

去掉括号，就可以了。

return {
    test: privateFunction,
    numTwo: _numTwo
}

另一种方式是:

return {
    test: function() { return privateFunction(); },
    numTwo: function() { return _numTwo(); }
}

这将把函数返回给另一个变量，或者只是在方法内部调用函数。

问候。

您似乎正在调用return中的2个函数，而不是将它们分配给test/numTwo属性。

也许你可以试试这个:

return {
    test: privateFunction,
    numTwo: _numTwo
}
相关文章：