2

しばらくして JavaScript を書き始めたばかりで、プラグイン コンストラクターのセットアップに戸惑っています。アドバイスを求めてこのリンクをたどりました。

関数の前の感嘆符は何をしますか?

この機能の設定を理解することに興味があります..

以下のような 3 つの例を見てきました。

(function(parameterOne, parameterTwo) {

    functionOne = function(...) {
       ...
   },

   functionTwo: new function() {
   },

   this.functionThree = function(...) {
   }

})()

私の質問は次のとおりです。

  1. functionOne 対 functionTwo 対 functionThree に与えられた構造をいつ使用しますか? functionOne、functionTwo、または functionThree を明示的に呼び出すにはどうすればよいですか?

  2. 私はこのような機能を見てきました：

    (function(parameter) {

    functionFour = function(..) {
   },
   ....
})(document)

この例のドキュメントは何を示していますか? 私はこれについて長い間混乱してきました。

  1. この構造に従う jQuery プラグインを見たことがありますか?

    (function($) {

  $.fn.myCustomPlugin: function(...) {
  }
})(jQuery)

関数に$が渡され、最後にjQueryが渡されるのはなぜですか? 初歩的な質問で申し訳ありませんが、ここ数週間、これらの質問に悩まされており、できる限りの回答を得たいと思っています.

ありがとう、

カルティック

4

1 に答える 1

2

(function(parameterOne, parameterTwo) {

最終的にこれらの引数を渡していないため、意味がありません。また、すぐに匿名コード ブロックを作成しようとしているように見えます - 場合によっては理にかなっていますが、このコード ブロック内で何が起こってもグローバル スコープを保護しようとしている場合を除き、それを行う必要はありません。

    functionOne = function(...) {
       ...
   },

これは に似た名前付き関数で、var functionOne親関数またはコンストラクター内でのみ役立ちます。

   functionTwo: new function() {
   },

更新:ここでインスタンスを作成しようとしているので、実際には意味がありません。その関数宣言内にあるものをすぐにインスタンス化できます（最初に func. を宣言してから operator を使用するのと同じですnew）が、この場合、取得するのは関数ではなくオブジェクトです。試す：

var f = function() {};
console.log(f); // "function"
var f = new function() {}
console.log(f); // "objest"

そのオブジェクトは、コンストラクター関数のインスタンスです。

   this.functionThree = function(...) {
   }

これはクラスのメソッドです。operator を使用してクラスをインスタンス化するnewと、インスタンスの外部からアクセスできます。またthis.、クラス内で使用する場合は、クラスをインスタンス化するたびに、この値用にメモリが予約されることに注意してください。これらのインスタンスの変数が異なる場合は問題ありませんが、メソッドの場合は、コンストラクターのプロトタイプに追加することをお勧めします。この方法では、一度だけ宣言され、新しいメモリ チャンクが予約されません。

})()

ここでは通常、リクエストしたパラメーターを内部で渡します。parameterOne, parameterTwo

(function(parameter) {

    functionFour = function(..) {
   },
   ....
})(document)

これは、コンテキストまたは任意のオブジェクトをこの匿名コード ブロックに渡す方法です。この場合、window.document を受け取るプラグインのように見えますが、DOM の他の部分を受け取ることもできます。たとえば、すべてのタグを選択してパラメーターとしてa受け取りたい場合documentは、window.document 内のすべてのリンクを反復処理しますが、 を渡す$('#somediv')と、このプラグインはこの ID を持つ div 内のリンクのみを反復処理します。

(function($) {

  $.fn.myCustomPlugin: function(...) {
  }
})(jQuery)

これは、コード内の $ が jQuery オブジェクトであることを確認する良い方法です。たとえば、Chrome には既にネイティブ関数が存在する$か、一部の運用サイト$では Prototype JS 関数である可能性があります。ただし、内部の例では、var$がネイティブ$でもプロトタイプでもないことを確認します。

一般に、(function() {...})()自由に使用するべきではありません。これは、上で述べたように、グローバル環境を保護している特定の場合にのみ使用されます。

于 2012-11-05T05:33:31.310 に答える