简体   繁体   English

关于JavaScript中的模块模式

[英]Regarding Module Pattern in JavaScript

i just read a small article on code project for Module Pattern in Java Script. 我刚刚读了一篇有关Java脚本中的Module Pattern的代码项目的小文章。 after reading javascript code few area was not very clear the way code has been written. 阅读javascript代码后,很少有地方不太清楚代码的编写方式。 i wrote javascript but i am not familiar with writing javascript in advance way. 我写了JavaScript,但我不熟悉提前编写JavaScript。 here is the url which i read from codeproject http://www.codeproject.com/Articles/619747/Module-Pattern-in-Java-Script-in-Depth 这是我从codeproject http://www.codeproject.com/Articles/619747/Module-Pattern-in-Java-Script-in-Depth中读取的网址

1) // A function that generates a new function for adding numbers 1)//一个函数,该函数生成一个新的数字加法函数

function addGenerator(num) {
    // Return a simple function for adding two numbers
    // with the first number borrowed from the generator
    return function (toAdd) {
        return num + toAdd
    };
}
// addFive now contains a function that takes one argument,
// adds five to it, and returns the resulting number
var addFive = addGenerator(5);
// We can see here that the result of the addFive function is 9,
// when passed an argument of 4
alert(addFive(4) == 9);   // Which return true

when addGenerator is calling then 5 has been passed as argument but i just do not understand this line that how it works 当addGenerator调用时,已将5作为参数传递,但我只是不明白这行的工作方式

return function (toAdd) {
        return num + toAdd
    };

what addGenerator(5) will return ? addGenerator(5)将返回什么?

how this will return true --> alert(addFive(4) == 9); 这将如何返回true-> alert(addFive(4)== 9); // Which return true //返回true

2) 2)

var EmployeeModule = (function (my) {
                my.anotherFunction = function () {
                    return alert('this is another function.');
                };
            } (EmployeeModule));

how the above code will work & will be invoke ? 上面的代码将如何工作并将被调用? please expalin in detail what they are trying to do? 请详细说明他们正在尝试做什么?

3) 3)

var EmployeeModule = (function (my) {
    // add functionality...
    return my;
}(EmployeeModule || {}));

i just do not understand this line (EmployeeModule || {})) please explain the meaning of this line. 我只是不明白这一行(EmployeeModule || {}))请解释这一行的含义。

4) Global Import in Module Pattern 4)全局导入模块模式

We can also import other java script libraries in our Module 我们还可以在模块中导入其他Java脚本库

(function ($, Y) {
    // now have access to globals jQuery (as $) and YAHOO (as Y) in this code
}(jQuery, YAHOO));

Sub-modules in Module Pattern

There are many cases where we can create sub-modules. 在许多情况下,我们可以创建子模块。 It is just like creating a regular module Collapse | 就像创建常规模块一样。 Copy Code 复制代码

EmployeeModule.subModule = (function () {
    var my = {};
    // ...
    return my;
}());

looking for good explanation for the above code point wise with more example for better explanation. 在上面的代码中寻找良好的解释,并提供更多示例以进行更好的解释。 thanks 谢谢

I don't use the module pattern often, so I am not able to answer all of your questions on this subject. 我不经常使用模块模式,因此我无法回答您关于此主题的所有问题。 I want to address your question regarding EmployeeModule || {} 我想解决您有关EmployeeModule || {}的问题。 EmployeeModule || {}

I think it is easier to understand what that means in a regular context not using the module pattern. 我认为在常规情况下不使用模块模式更容易理解这意味着什么。 Consider this. 考虑一下。

var foo = foo || {};

This is checking to see if foo exists already. 这是在检查foo是否已经存在。 If so, we don't overwrite, we just set it equal to itself...the same as this: 如果是这样,我们就不会覆盖,我们只是将其设置为等于自身……与此相同:

var foo = {bar:'value'};
var foo = foo;

If foo doesn't exists, then we're creating a new object, like this: 如果foo不存在,则我们将创建一个新对象,如下所示:

var foo = {};

So, the code says "foo equals the previous foo (if foo is already something) OR a new object (if foo ISN'T already something)" 因此,代码说“ foo等于先前的foo(如果foo已经是某种东西)或一个新对象(如果foo ISN还不是某种东西)”

In your example, EmployeeModule || {} 在您的示例中, EmployeeModule || {} EmployeeModule || {} is being passed into the instantly invoked function expression as a parameter called my . EmployeeModule || {}作为名为my的参数传递到即时调用的函数表达式中。 If EmployeeModule is something, that gets set to my . 如果EmployeeModule是某物,则将其设置为my If EmployeeModule is nothing, then the value of my is a new object. 如果EmployeeModule为空,则my的值是一个新对象。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM