Question

我已经编写了第一个 jQuery插件，它有点像这样。

(function ($) {
    $.fn.MyFancyPlugin= function (settings) { 

        var defaults = {
            someSetting = 'default for some setting'
        };

        var settings = $.extend({}, defaults, settings);

        function foo(){
            // do stuff
        };

        function bar(){
            // do stuff
        };

        return this.each(function (){
            // do more stuff
        });
    };
})(jQuery);

这个插件工作得很好，但我对于看起来很讨厌看起来很讨厌函数嵌套的方式。

我对JS外观的“偏好”是这样的。

MyNamespace.Class1 = {

    foo: 'foo',

    bar: function() {
        return 'bar';
    }
};

但在制作jQuery插件时，我似乎无法理解这一点。有人能伸出援助之手吗？我最关心的是var以及他们是私人的事实。

另外，我想知道构建JavaScript的每种方法的“官方”名称是什么。

Answer 1

你的第一个例子没有任何问题，这是一个松散的＆＃34;模块＆＃34;模式，除了它可能不必要地复制功能。您的后一个示例就是如何将匿名函数分配给对象的属性，如果有问题的函数不需要是对象的属性，这是不合适的。

通过将函数包装在其他函数中来限制函数的范围是一个基本的JavaScript习惯用语，而不是丑陋。

但是，如果foo和bar在调用插件函数时不需要访问范围内的变量和参数（如果defaults真的是静态的话），您可以将它们移出一个级别，这样每次调用插件时都不会重新创建它们：

(function ($) {
    var defaults = {
        someSetting: 'default for some setting'
    };

    function foo(){
        // do stuff
    };

    function bar(){
        // do stuff
    };

    $.fn.MyFancyPlugin= function (settings) { 

        var settings = $.extend({}, defaults, settings);

        return this.each(function (){
            // do more stuff
        });
    };
})(jQuery);

另请注意，我更正了defaults初始值设定项的语法（:，而不是=）。

旁注：由于您的插件功能不是构造函数功能，因此JavaScript世界中的压倒性惯例是使用带有初始小写字母的camelCasing（例如{{1而不是myFancyPlugin）。

如何让我的jQuery插件代码更漂亮？

1 个答案: