18

OK jQuery.extendとjQuery.fn.extendの違いはわかりますか？

一般的なextendは任意のオブジェクトを拡張でき、fn.extendは、内部jqueryブードゥーを使用してjqueryオブジェクトから直接呼び出すことができるプラグイン関数用です。

したがって、それらを異なる方法で呼び出すように見えます。関数yを追加してオブジェクトobjを拡張するためにgeneralextendを使用する場合、メソッドはそのオブジェクトobj.y（）にアタッチしますが、fn.extendを使用する場合、それらはjqueryオブジェクト$ .y（）に直接アタッチされます。 ...私はその正しいはいまたはいいえを取得しましたか？いいえの場合、私は私の理解で何が間違っていますか？

今私の質問：

私が読んでいる本は、

jQuery.fn.extend({
    a: function() { },
    b: function() { }
});

構文ですが、ドキュメントには

jQuery.fn.a = function() { };

そして、もしあなたがbも欲しければ、それは

jQuery.fn.b = function() { };

これらは機能的にもパフォーマンス的にも同等ですか？そうでない場合、違いは何ですか？

どうもありがとうございます。私はjQueryを掘っています！

4

2 に答える 2

28

それらの間には非常に微妙な違いがあります。パフォーマンスに関しては（これが問題であるというわけではありません）、jQuery.fn.extendのような関数を直接宣言するよりも遅くなりますjQuery.fn.foo = function(){ };。私は完全に無視できる違いを話している。

違いはjQuery.fn.extend()、複数のプラグイン関数を同時に追加できることであり、作成しているプラ​​グインのタイプによっては、コードが少しすっきりと見える場合があります。

jQuery.fn.a = function(){};
jQuery.fn.b = function(){};

とまったく同じです

jQuery.fn.extend({
  a: function(){ },
  b: function(){ }
});
于 2010-04-09T18:42:19.357 に答える
6

どちらの方法もほとんど同じです。ただし、次の点でいくつかの小さな違いがあります-

  1. スピード
  2. コードスタイル
  3. プラグインに他の場所で名前を付ける

スピード：

無視できる。2つのパフォーマンスの違いに気付く可能性は低いため、この側面は無視してかまいません。

コードスタイル：

拡張バージョンは、オブジェクトリテラルコードスタイルに準拠しています。これは、一部の人にとっては少しエレガントに見えるかもしれません。たとえば、プラグインがObjectリテラルを豊富に使用している場合は、$。extend（{}）を使用してラップすることをお勧めします。

プラグインに他の場所で名前を付ける：

$ .fn.aスタイルを使用することにはもう1つの（重要な、私の意見では）利点があります-プラグインの名前をコード内のどこかに保存し、プラグインをjQueryの名前空間に追加するときにその参照を使用できます。オブジェクトリテラルを使用して拡張する場合、これは実行できません。この利点は、コードの長さとプラグイン名の出現回数にいくらか関連しています。また、平均的なコーダーがプラグインの名前を変更することはめったにないと主張する人もいるかもしれません。変更した場合、ほとんどの場合、それほど時間はかかりません。

例：

;(function($) {

    // Declare your plugin's name here
    var PLUGIN_NS = 'myPluginName';

    // ... some arbitrary code here ...

    // The jQuery plugin hook
    $.fn[ PLUGIN_NS ] = function( args ) {

        if ( $.type(args) !== 'object' )
            var args = {};

        var options = $.extend({}, $.fn[ PLUGIN_NS ].defaults, args);

        // iterate over each matching element
        return this.each({
            var obj = $(this);

            // we can still use PLUGIN_NS inside the plugin
            obj.data( PLUGIN_NS+'Data' , args );

            // ... rest of plugin code ...
        });

    };

    // ----------------
    // PRIVATE defaults
    // ----------------

    var defaults = {
        foo: 1,
        bar: "bar"
    };

    // ------------------------------------------------------------
    // PUBLIC defaults
    // returns a copy of private defaults.
    // public methods cannot change the private defaults var.
    // ------------------------------------------------------------

    // we can use PLUGIN_NS outside the plugin too.
    $.fn[ PLUGIN_NS ].defaults = function() {
        return $.extend({}, defaults);
    };

})(jQuery);

これで、プラグインとデフォルトを次のように呼び出すことができます。

$("div#myDiv").myPluginName({foo:2});
var originalFoo = $("div#myDiv").myPluginName.defaults().foo;

プラグインの名前を変更するには、PLUGIN_NS変数を変更します。これは、プラグインコード内で出現するmyPluginNameを変更するよりも望ましい場合があります。

于 2012-06-12T19:01:53.213 に答える