ドル記号で始まる変数を持つJavaScriptをよく目にします。いつ/なぜこのように変数にプレフィックスを付けるのを選ぶのですか?
(私は$('p.foo')
あなたがjQueryなどで見る構文について尋ねているのではなく、$name
andのような通常の変数です$order
)
ドル記号で始まる変数を持つJavaScriptをよく目にします。いつ/なぜこのように変数にプレフィックスを付けるのを選ぶのですか?
(私は$('p.foo')
あなたがjQueryなどで見る構文について尋ねているのではなく、$name
andのような通常の変数です$order
)
回答:
jQueryでの非常に一般的な使用法は、変数に格納されているjQueryオブジェクトを他の変数と区別することです。
たとえば、次のように定義します。
var $email = $("#email"); // refers to the jQuery object representation of the dom object
var email_field = $("#email").get(0); // refers to the dom object itself
これは、jQueryコードの記述に非常に役立ち、異なるプロパティセットを持つjQueryオブジェクトを簡単に確認できるようになります。
ECMAScriptの第1版、第2 版、および第3版では、自動生成されたコードのコンテキストを除いて、$接頭辞付きの変数名の使用は仕様で明示的に推奨されていません。
ドル記号(
$
)と下線(_
)は、識別子のどこでも使用できます。ドル記号は、機械的に生成されたコードでのみ使用するためのものです。
ただし、次のバージョン(最新版である第5版)では、この制限がなくなり、上記の文章が次のように置き換えられました。
ドル記号(
$
)とアンダースコア(_
)は、IdentifierNameの任意の場所で使用できます。
そのため、$記号を変数名で自由に使用できるようになりました。特定のフレームワークとライブラリには、シンボルの意味に関する独自の規則があります。
$variable
ています。初心者のJSプログラマーがを見ると、jQueryオブジェクト全体が含まれていることが原因と考えられます。
他の人が述べたように、ドル記号は機械的に生成されたコードで使用されることを意図しています。ただし、その慣例は、非常に人気のあるJavaScriptライブラリによって破られています。JQuery、プロトタイプ、MS AJAX(AKAアトラス)はすべて、この文字を識別子に(または識別子全体として)使用します。
つまり、$
いつでも好きなときに使用できます。(通訳は文句を言わないでしょう。)問題はいつそれを使いたいですか?
個人的には使用していませんが、使用は妥当だと思います。MS AJAXはこれを使用して、関数がさらに詳細な呼び出しのエイリアスであることを示していると思います。
例えば:
var $get = function(id) { return document.getElementById(id); }
それは合理的な慣習のようです。
AngularJSのコンテキストでは、$
プレフィックスはフレームワークのコードの識別子にのみ使用されます。フレームワークのユーザーは、自分の識別子で使用しないように指示されています。
Angular名前空間
$
と$$
コードとの偶発的な名前の衝突を防ぐために、Angularは、パブリックオブジェクトの
$
名前の前にとプライベートオブジェクトの名前の前にを付け$$
ます。コードで$
または$$
プレフィックスを使用しないでください。
私はこの大会を2006年に開始し、初期のjQueryメーリングリストで宣伝した人物だったので、その歴史と動機をいくつか紹介します。
受け入れられた答えはこの例を与えます:
var $email = $("#email"); // refers to the jQuery object representation of the dom object
var email_field = $("#email").get(0); // refers to the dom object itself
しかし、それは本当にそれをよく説明していません。がなくても$
、ここには2つの異なる変数名email
とがありemail_field
ます。それはそこに十分良いです。$
すでに2つの異なる名前がある場合、なぜ名前の1つにをスローする必要があるのでしょうか。
実際、私はemail_field
2つの理由でここでは使用しませんでした。names_with_underscores
慣用的なJavaScriptでfield
はないこと、およびDOM要素に対して実際には意味がないことです。しかし、私は同じ考えに従いました。
私はいくつかの異なるものを試しましたが、そのうちの例に非常に似ています:
var email = $("#email"), emailElement = $("#email")[0];
// Now email is a jQuery object and emailElement is the first/only DOM element in it
(もちろん、jQueryオブジェクトは複数のDOM要素を持つことができますが、私が取り組んでいるコードには多くのid
セレクターがあったため、それらの場合は1対1で対応していました。)
関数がパラメーターとしてDOM要素を受け取り、それにjQueryオブジェクトも必要とする別のケースがありました。
// email is a DOM element passed into this function
function doSomethingWithEmail( email ) {
var emailJQ = $(email);
// Now email is the DOM element and emailJQ is a jQuery object for it
}
まあそれは少し混乱しています!私のコードの1つemail
は、jQueryオブジェクトでemailElement
DOM要素ですが、もう1つemail
はDOM要素でemailJQ
あり、jQueryオブジェクトです。
一貫性がなく、混ぜ続けました。さらに、同じものに対して2つの異なる名前を作成しなければならないのは少し厄介でした。1つはjQueryオブジェクト用で、もう1つは一致するDOM要素用です。加えてemail
、emailElement
とemailJQ
、私も他のバリエーションをしようとし続けました。
それから私は一般的なパターンに気づきました:
var email = $("#email");
var emailJQ = $(email);
JavaScriptは$
名前の単なる別の文字として扱うので、$(whatever)
呼び出しから常にjQueryオブジェクトが返されるので、最終的にパターンが浮かび上がりました。私は$(...)
電話をかけて、いくつかの文字を削除するだけで、かなりいい名前が付けられます:
$
("#email")$
(email)
取り消し線は完全ではありませんが、アイデアが得られる場合があります。一部の文字を削除すると、これらの行は両方とも次のようになります。
$email
そのとき、emailElement
またはのような規則を作る必要がないことに気づきましたemailJQ
。私をじっと見つめるすてきな慣習がすでにあり$(whatever)
ました$whatever
。通話からいくつかのキャラクターを連れて行くと、それはに変わります。
var $email = $("#email"), email = $email[0];
// $email is the jQuery object and email is the DOM object
そして:
// email is a DOM element passed into this function
function doSomethingWithEmail( email ) {
var $email = $(email);
// $email is the jQuery object and email is the DOM object
// Same names as in the code above. Yay!
}
したがって、常に2つの異なる名前を作成する必要はありませんでしたが、$
プレフィックスの有無にかかわらず同じ名前を使用できました。そして、$
接頭辞は、私はjQueryオブジェクトを扱ったことの素敵なリマインダーでした。
$('#email').click( ... );
または:
var $email = $('#email');
// Maybe do some other stuff with $email here
$email.click( ... );
Stevoは正解です。ドル記号の記号(JavascriptとjQueryプラットフォームではPHPではない)の意味と使用法は完全にセマンティックです。$は、識別子名の一部として使用できる文字です。さらに、ドル記号は、おそらくJavaScriptで遭遇する可能性のある最も「奇妙な」ものではありません。次に、有効な識別子名の例をいくつか示します。
var _ = function() { alert("hello from _"); }
var \u0024 = function() { alert("hello from $ defined as u0024"); }
var Ø = function() { alert("hello from Ø"); }
var $$$$$ = function() { alert("hello from $$$$$"); }
上記の例はすべて機能します。
それらを試してください。
$文字は、JavaScriptエンジンにとって特別な意味を持ちません。これは、az、AZ、_、0-9などの変数名に含まれるもう1つの有効な文字です。
$
、JavaScriptでは特別な意味がありません。限目。
以来_
、変数名の先頭にしばしばプライベート変数を示すために使用される(あるいは少なくとも一方がプライベート残ることを意図し)されて、私が見つけ$
、一般的なコードライブラリに私自身の簡単なエイリアスの前に追加するための便利。
たとえば、jQueryを使用する場合は、変数を$J
(の代わりに$
)使用$P
し、php.js を使用する場合などを使用します。
プレフィックスは、自分の静的変数などの他の変数と視覚的に区別し、コードが一部のライブラリまたはその他の一部であるという事実に私を導き、規則を知っていれば、他の変数と競合したり混乱したりする可能性が低くなります。
また、ライブラリを呼び出すたびに完全に指定された名前が繰り返されるので、コードが煩雑になりません(または追加の入力が必要になります)。
私はそれを修飾キーが単一キーの可能性を拡張するために何をするかに似ていると考えたいです。
しかし、これは単なる私の慣習です。
私が過去4年間経験してきたように、値/オブジェクトを指す変数か、jQueryでラップされたDOM要素かを簡単に識別できるようになります
Ex:
var name = 'jQuery';
var lib = {name:'jQuery',version:1.6};
var $dataDiv = $('#myDataDiv');
上記の例で変数 "$ dataDiv"を見ると、この変数がjQueryでラップされたDOM要素(この場合はdiv)を指していると簡単に言えます。また、$($ dataDiv).append()の代わりに$ dataDiv.append()、$ dataDiv.html()、$ dataDiv.find()のようにオブジェクトを再度ラップせずにすべてのjQueryメソッドを呼び出すこともできます。
それが役に立てば幸いです。最後に、これに従うことは良い習慣であるが必須ではないということを言いたい。
${varname}
jQuery開発者がjQuery要素を保持している変数を区別するために使用する単なる命名規則です。
プレーン{varname}
は、テキストや文字列などの一般的なものを格納するために使用されます。
${varname}
jQueryから返された要素を保持します。
プレーン{varname}
を使用してjQuery要素を格納することもできますが、冒頭で述べたように、プレーン変数とは区別され、はるかに理解しやすくなります(プレーン変数と混同して全体を検索して、何が保持されているかを理解することを想像してください)。 。
例えば :
var $blah = $(this).parents('.blahblah');
ここでは、何とか返されたjQuery要素が格納されています。
したがって、誰かが$blah
コードでを見ると、それが単なる文字列や数値ではなく、jQuery要素であることがわかります。
単に識別子のプレフィックスとして使用できますが、たとえば、テンプレートの置換トークンなど、生成されたコードに使用されることが想定されています。
ドル記号($)またはダブルドル記号($$)が表示され、これがプロトタイプフレームワークで何を意味するのか知りたい場合は、次のように答えます。
$$('div');
// -> all DIVs in the document. Same as document.getElementsByTagName('div')!
$$('#contents');
// -> same as $('contents'), only it returns an array anyway (even though IDs must be unique within a document).
$$('li.faux');
// -> all LI elements with class 'faux'
有効なJavaScript識別子shuoldは、文字、アンダースコア(_)、またはドル記号($)で始まる必要があります。後続の文字も数字(0-9)にすることができます。JavaScriptでは大文字と小文字が区別されるため、文字には「A」〜「Z」(大文字)の文字と「a」〜「z」(小文字)の文字が含まれます。
詳細:https :
//developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Grammar_and_types#Variables