ホームページ >ウェブフロントエンド >jsチュートリアル >jQuery.fn とは何ですか?またその仕組みは何ですか?

jQuery.fn とは何ですか?またその仕組みは何ですか?

DDD
DDDオリジナル
2024-11-05 03:57:02356ブラウズ

What is jQuery.fn and How Does It Work?

jQuery.fn: jQuery でのプロトタイプ エイリアス

jQuery では、jQuery.fn.jquery で出現する用語「fn」は、 jQuery コンストラクター関数 ($) のプロトタイプ プロパティのエイリアス。これを理解するには、JavaScript のコンストラクター関数の概念を理解することが重要です。

コンストラクター関数は、オブジェクトのインスタンスを作成するために使用され、各インスタンスはコンストラクターのプロトタイプからプロパティとメソッドを継承します。 jQuery の場合、$ 識別子はコンストラクター関数として機能します。

たとえば、次のコンストラクター関数を考えてみましょう。

<code class="javascript">function Test() {
  this.a = 'a';
}
Test.prototype.b = 'b';

var test = new Test(); 
test.a; // "a", own property
test.b; // "b", inherited property</code>

Test コンストラクター関数は、そのプロトタイプから継承するインスタンス テストを作成します。 。テスト インスタンスには独自のプロパティ a があり、b はプロトタイプから継承されます。

同様に、jQuery も同様のアプローチに従います。

<code class="javascript">(function() {
  var foo = function(arg) { // core constructor
    // ensure to use the `new` operator
    if (!(this instanceof foo))
      return new foo(arg);
    // store an argument for this example
    this.myArg = arg;
    //..
  };

  // create `fn` alias to `prototype` property
  foo.fn = foo.prototype = {
    init: function () {/*...*/}
    //...
  };

  // expose the library
  window.foo = foo;
})();

// Extension:

foo.fn.myPlugin = function () {
  alert(this.myArg);
  return this; // return `this` for chainability
};

foo("bar").myPlugin(); // alerts "bar"</code>

ここで、fn エイリアスはプロトタイプを指します。 foo コンストラクター関数。 fn プロパティを拡張すると、foo コンストラクターのすべてのインスタンスに新しいメソッド (例の myPlugin など) を追加できるようになります。

以上がjQuery.fn とは何ですか?またその仕組みは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。