7

jQueryプラグインの設計パターンがどのように行われ、どのように機能するかを概念化する(そしてできれば理解してもらう)ために、誰かがjavascriptで非常に単純な基本的な例を書き留めてもらえますか?

jQuery のプラグインを作成する方法には興味がありません (したがって、jQuery コードはまったくありません)。プラグインの概念がどのように行われるかを説明するための簡単な説明 (おそらく少しの Javascript コードを使用) に興味があります。

jQueryコードを読みに行くように返信しないでください。試してみましたが、複雑すぎます。そうでなければ、ここに質問を投稿しなかったでしょう。

ありがとう!

4

3 に答える 3

5

jQuery には、 という名前の内部オブジェクトに格納された関数のライブラリがありますfn。これらは、すべての jQuery オブジェクトで呼び出すことができるものです。

そうすると、そのクラスのすべての要素を$("div.someClass")含む jQuery オブジェクトが得られます。これで、それぞれに適用する<div>ことができます。これは、(この場合は組み込み関数)に格納されている関数の 1 つであることを意味します。$("div.someClass").each( someFunction )someFunctioneach()fn

内部fnオブジェクトを拡張 (追加) すると、同じ構文でカスタム関数を自動的に使用できるようになります。と呼ばれる、すべての要素をコンソールに記録する関数があると仮定しましょうlog()。この関数を$.fnに追加して、 として使用できます$("div.someClass").log()

オブジェクトに追加されたすべての関数は、関数本体でキーワードが使用した jQuery オブジェクトを指すfnような方法で呼び出されます。this

thisメソッドの連鎖が壊れないように、カスタム関数の最後に戻るのが一般的な方法です$("div.someClass").log().each( someFunction )

関数をオブジェクトに追加する方法はいくつかありますが$.fn、より安全なものもあります。かなり安全な方法は次のとおりです。

jQuery.fn.extend({
  foo: function() {
    this.each( function() { console.log(this.tagName); } );
    return this;
  }
})
于 2010-05-20T11:51:50.613 に答える
1

Tomalak は、知っておくべきことのほとんどすべてをすでに投稿しています。

最後に、jQuery がthisキーワードを使用してトリックを実行するのに役立つことが 1 つあります。

apply() というメソッドです

var somefunction=function(){
alert(this.text);
}
var anObject={text:"hello"};

somefunction.apply(anObject);
//alert "hello" will happen

抽象化を作成するのに本当に役立ちますので、フレームワーク/プラグインのユーザーは、コード内にあるものが何であれ、直感的にこれを使用できます

于 2010-05-20T11:58:45.993 に答える
0

他の多くの js フレームワークと同様に、javascript プロトタイプの向きを使用して動作します。

たとえば、単純な関数を宣言できます

var alertHelloWorld = function() {
    alert('hello world');
}

そして、それを既存のオブジェクト(DOMノードを含む)に結び付けます

document.doMyAlert = alertHelloWorld;

こうすれば

document.doMyAlert();

alertHelloWorld 関数が実行されます

JavaScript オブジェクトのプロトタイピングについて詳しくは、こちらをご覧ください。

于 2010-05-20T11:46:30.693 に答える