Question

我正在努力维护具有以下编码风格的ASP.NET MVC应用程序。该观点有：

<script type="text/javascript">

    $(document).ready(function() {

        SAVECUSTOMERS.init();
    });
</script>

这里包含一个js文件：

var SAVECUSTOMERS = (function() {

    init = function () {

        $("#saveCust").bind("click", OnSave);
        $("#cancel").bind("click", OnCancel);

    },

    OnSave= function() {

        //Save Logic;

    },

    OnCancel = function() {
                //Cancel logic;

    }

    return { init: init };

})();

这是JS编码风格的最佳实践吗？意图是非突兀的JS？
什么是SAVECUSTOMERS？我知道有不同的方法在javascript中创建类（按照link），但这种风格不属于列出的任何类别
我在哪里可以找到有关这种JS编码风格的更多信息？

Answer 1

1）使用$（document）.ready（或其他库中的类似函数）函数被认为是JavaScript中的标准做法。首先，它确保您的JavaScript在已完成评估/构建DOM的页面上执行。并且它还在识别DOM实际上准备就绪时抽象出一些浏览器实现的不一致性。但我假设你主要是指第二个代码块。

你看到SAVECUSTOMERS被分配了一个自动执行匿名函数的结果。这样做有几个原因，最常见的是能够控制匿名函数内的函数和数据的范围和“命名空间”。这是因为JavaScript具有词法范围，而不是块级范围。

在JavaScript中使用这些自调用函数的做法很常见

但是代码本身有几个问题。变量init，OnSave和OnCancel被声明为全局变量（因为省略了var关键字）。这在很大程度上违背了将它们包装在自我调用函数中的目的。此外，该函数的内容使用了对象分配语法和标准表达式语法的混合，这将导致语法错误。

此外，通过仅返回init函数，onSave和onCancel函数已通过使用闭包被有效地“隐藏”或变为“私有”。这有助于保持名称空间的清洁和封装。

如果我正在编写此代码（这里有一些个人的权限，有几种方法可以实现simliar），那么它看起来像这样：

var SaveCustomers = (function($) {
    var init = function () {
        $("#saveCust").bind("click", onSave);
        $("#cancel").bind("click", onCancel);
    };

    var onSave = function() {
        //Save Logic;
    };

    var onCancel = function() {
        //Cancel logic;
    }

    return { init: init };

})(jQuery);

关于上述的一些注释：

我使用var关键字声明变量。这使它们的范围保持在本函数的本地（你也可以在技术上使用命名函数声明）
我将jQuery作为自调用函数中的参数传递，并将其作为函数调用中的参数赋值给$。这样可以保护函数内部的$变量，以便知道它引用jQuery，并且还没有被也使用$的二级库所驱动。

2）SAVECUSTOMERS是一个基本的JavaScript对象，它有一个名为'init'的属性，其值是一个函数，由执行中的init声明定义。

3）不确定如何回答这个问题 - 理解JavaScript最佳实践的最佳选择是阅读已知的其他JavaScript代码，例如jQuery源代码，或原型，或下划线等

Answer 2

这种风格被称为jquery ...你检查了JQuery网站，仔细检查......

Answer 3

这在javascript中称为自我调用函数。我在下面给出的一篇文章。你可以在google上获得更多。

http://2007-2010.lovemikeg.com/2008/08/17/a-week-in-javascript-patterns-self-invocation/

如果您指的是 $ 编程，那么它与JQuery相关，其他答案也提供了链接。

Answer 4

它正在使用JQuery library。

JQuery包含一个名为$()的函数，它允许您使用类似CSS的语法从DOM中选择元素。

$(document).ready位是一种标准的JQuery方法，用于确保封装的代码仅在页面加载完成后运行。这是确保事件正确附加到相关DOM对象所必需的。

将函数用作其他函数的参数的位被称为“闭包”，这是编写Javascript的一种非常常见的方式，但特别是在使用JQuery时，它会让事情变得简单易行。这种编码风格的最小代码。

参见本页：http://blog.morrisjohns.com/javascript_closures_for_dummies初学者讨论闭包在Javascript中的工作方式以及如何编写它们（请注意，此页面根本没有查看JQuery;闭包是一个大量使用的Javascript功能通过JQuery，但你不需要JQuery来编写闭包）

Answer 5

这是使用jQuery处理事件的常用方法。

基本上发生的是您检查文档是否已加载

 $(document).ready(function() {

        SAVECUSTOMERS.init();
    });

当你开始将你的绑定添加到按钮或它们可能是什么时。

Answer 6

SAVECUSOMTERS中代码的意图是模仿对象中的私有属性和公共属性。由于JS默认不支持这些，因此这个自调用函数执行并返回一定数量的属性。在这种情况下，它返回'init'方法。尽管您看到OnSave和OnClick，但您会发现根本无法访问它们。它们是“私有的”，仅在该函数内部使用。

$()函数是一个名为jQuery http://jquery.com的javascript库的一部分。它是一个非常全面的库，主要用于DOM操作。

$（document）.ready（）函数是jQuery连续轮询页面直到加载的一种方式。如果是，则执行内部的javascript。

Answer 7

目标是拥有公共和私人功能。 OnSave和OnCancel是私有函数，只能在自执行匿名(function() { ... } ())的范围内访问，后者返回一个公开访问init函数的对象。 / p>
SAVECUSTOMERS成为上述函数返回的对象，即{ init: init }，一个具有一个方法init的对象，可以访问该闭包中的函数。
你可以阅读Douglas Crockford的 Javascript：The Good Parts 或Stoyan Stefanov的 Javascript模式

其他说明：

$()函数属于jQuery库
存在语法错误，因为函数应由;而非,分隔，因为它们位于函数内，而不是对象。

这是什么JavaScript编码风格？

7 个答案: