JavaScript変数がドル記号で始まるのはなぜですか?
-
03-07-2019 - |
質問
ドル記号で始まる変数を持つJavaScriptをよく目にします。いつ/なぜこのように変数にプレフィックスを付けることを選択しますか?
(jQueryなどで見られる $( 'p.foo')
構文については聞いていませんが、 $ name
や $ 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オブジェクトを見やすくします。
他のヒント
1番目、2番目、および ECMAScriptの第3版、$プレフィックス付き変数名の使用は、自動生成コードのコンテキストを除き、仕様によって明示的に推奨されていません。
ドル記号(
$
)とアンダースコア(_
)は、識別子のどこでも使用できます。ドル記号は、機械的に生成されたコードでのみ使用することを目的としています。
ただし、次のバージョン(第5版(現在))、この制限は廃止され、上記の文章は次のように置き換えられました
ドル記号(
$
)とアンダースコア(_
)は、 IdentifierName のどこでも使用できます。
そのため、$記号は変数名に自由に使用できるようになりました。特定のフレームワークとライブラリには、シンボルの意味に関する独自の規則があります。ここで他の回答に記載されています。
他の人が述べたように、ドル記号は機械的に生成されたコードで使用されることを意図しています。ただし、その慣習は、非常に人気のあるJavaScriptライブラリによって破られています。 JQuery、Prototype、およびMS AJAX(別名Atlas)はすべて、この文字を識別子で(または識別子全体として)使用します。
要するに、いつでも $
を使用できます。 (通訳は文句を言いません。)問題は、いつ 使いたいですか?
個人的には使用していませんが、その使用は有効だと思います。 MS AJAXは、関数がより詳細な呼び出しのエイリアスであることを示すためにそれを使用すると思います。
例:
var $get = function(id) { return document.getElementById(id); }
それは合理的な慣習のようです。
AngularJSのコンテキストでは、 $
プレフィックスはフレームワークのコード内の識別子にのみ使用されます。フレームワークのユーザーは、独自の識別子で使用しないように指示されます。
Angular Namespaces
$
および$$
コードとの偶発的な名前の衝突を防ぐため、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
and:
// 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 $$<*>quot;); }
上記の例はすべて機能します。
試してください。
$文字には、JavaScriptエンジンにとって特別な意味はありません。これは、a-z、A-Z、_、0-9などの変数名に含まれる別の有効な文字です...
変数名の先頭にある _
はプライベート変数(またはプライベートのままにするための少なくとも1つ)を示すためによく使用されるため、 $
は汎用コードライブラリに自分の短いエイリアスの前に追加します。
たとえば、jQueryを使用する場合、( $
だけでなく)変数 $ J
を使用し、次の場合に $ P
を使用しますphp.jsなどの使用
プレフィックスは、自分の静的変数などの他の変数と視覚的に区別し、コードがライブラリなどの一部であり、慣例を知っていれば他の人と競合したり混同したりする可能性が少ないという事実に私を引き付けます。
また、完全に指定された名前がライブラリ呼び出しごとに繰り返されるように、コードを乱雑にしません(または追加の入力を必要としません)。
単一キーの可能性を広げるために修飾キーが行うことと似ていると考えたい。
しかし、これは私自身の慣例です。
過去4年間経験したように、値/オブジェクトを指す変数かjQueryでラップされたDOM要素かを簡単に識別できるようになります
Ex:
var name = 'jQuery';
var lib = {name:'jQuery',version:1.6};
var $dataDiv = $('#myDataDiv');
変数&quot; $ dataDiv&quot;を見たときの上記の例jQueryでラップされたDOM要素(この場合はdiv)を指すこの変数は簡単に言うことができます。また、$($ dataDiv).append()の代わりに、$ dataDiv.append()、$ dataDiv.html()、$ dataDiv.find()のように、オブジェクトを再度ラップしてすべてのjQueryメソッドを呼び出すことができます。
お役に立てば幸いです。 最後に、これに従うことをお勧めしますが、必須ではありません。
単純に識別子のプレフィックスとして使用できますが、たとえば、テンプレート内の置換トークンなど、生成されたコードに使用することになっています。
$ {varname}
は、jQuery開発者がjQuery要素を保持している変数を区別するために使用する単なる命名規則です。
Plain {varname}
は、テキストや文字列などの一般的なものを保存するために使用されます。
$ {varname}
はjQueryから返された要素を保持します。
プレーンな {varname}
を使用してjQuery要素を格納することもできますが、冒頭で述べたように、これによりプレーンな変数と区別され、理解しやすくなります(混乱させることを想像してください)単純な変数であり、それが何を保持しているかを理解するために全面的に検索する)。
例:
var $blah = $(this).parents('.blahblah');
ここで、blahは返されたjQuery要素を格納しています。
したがって、他の誰かがコードに $ blah
を見ると、それは単なる文字列または数字ではなく、jQuery要素であると理解します。
Angular は、フレームワークによって生成されたプロパティ用です。推測すると、それらはECMA-262 3.0によって提供される(現在は無効な)ヒントに従っています。
$は、通常の変数の場合に共通変数とjquery変数を区別するために使用されます。 FLIPKARTで注文することができます。注文が文字列出力を示す変数である場合は、「order」としてsimpleという名前が付けられます。しかし、注文をクリックすると、オブジェクトが返され、そのオブジェクトは「$ order」として$で示されます。プログラマーがコード全体でjavascript変数とjquery変数を切り取ることができるように。
ドル記号($)または二重ドル記号($$)が表示され、Prototypeフレームワークでこれが何を意味するのか興味がある場合は、次のように答えてください。
$('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変数でphpの名前の規則を時々使用する理由: 入力検証を行うとき、クライアント側とまったく同じアルゴリズムを実行したい およびサーバー側。メンテナンスを簡素化するために、コードの2つの側面をできる限り似たものにしたいのです。変数名にドル記号を使用すると、これが簡単になります。
(また、いくつかの賢明なヘルパー関数は、コードを似たものにするのに役立ちます。たとえば、入力値のルックアップ、非OOバージョンのstrlen、substrなどです。ただし、手動で調整する必要があります。)
有効なJavaScript識別子shuoldは文字で始まる必要があり、 アンダースコア(_)、またはドル記号($); 後続の文字も 数字(0-9)です。 JavaScriptでは大文字と小文字が区別されるため、 手紙 文字「A」を含める; &quot; Z&quot; (大文字)および 文字&quot; a&quot; &quot; z&quot; (小文字)。
詳細:
https://developer.mozilla.org/en-US / docs / Web / JavaScript / Guide / Grammar_and_types#Variables