web-dev-qa-db-ja.com

JavaScriptの命名規則

私はJavaバックグラウンドで、JavaScriptを初めて使用しています。以下の例のように、1文字のパラメーター名を使用する多くのJavaScriptメソッドに気づきました。

doSomething(a,b,c)

私はそれが好きではありませんが、JavaScript開発者の仲間は、これがファイルサイズを小さくするために行われていることを確信し、JavaScriptファイルをブラウザーに転送する必要があることに注意しました。

その後、別の開発者と話していることに気づきました。彼は、Firefoxがページをより速くロードするために変数名を切り捨てる方法を私に示しました。これはWebブラウザの標準的な方法ですか？

JavaScriptでプログラミングする際に従うべきベストプラクティスの名前変換は何ですか？識別子の長さは重要であり、重要な場合はどの程度ですか？

javascriptnamingcoding-standardsconventions
12
ManuPK

開発者自身が短い変数名を使用していることがわかります。開発中、彼らは意味のある詳細な変数名を使用しています。

次に、、ビルド/リリースプロセスで、彼らが書いたコードは、意図的にミニファイア/ obfuscator を介して実行されます ベストプラクティス として、ファイルのサイズを最小限に抑えることで、Webサイトを高速化します。これはオプション気になる場合の手順ですそれパフォーマンスについて多くのことを行います。ほとんどの小さなWebサイトはこれを行いません。

あなたは、開発者として、ミニファイ/難読化プロセスについてケアすべきではありません。読みやすく、意味があり、十分に文書化され、適切に構造化されるようにコードを記述します。 次にパフォーマンスを重視する場合（オプション、忘れないでください！）、コードを最小化するためにリリースプロセスにminifier/obfuscatorを導入します（空白、改行、コメントなどを削除し、難読化します（変数名を短くするなど）。難読化と縮小化を説明する優れた記事は ここにあります です。

さらに、デスクトップFireFoxはnot変数名を切り捨てますperiod。変数名の切り捨ては、ページのダウンロードを高速化するためにあります。 FireFoxがファイルを取得するまでに、ファイルはすでにダウンロードされているため、ダウンロードする必要はありません。あなたの友人はこれをしているプラ​​グインを実行するかもしれません。その場合、それは役に立たないのでアンインストールするように彼に言ってください。

完了するために、some（モバイル）ブラウザーには、要求されたリソースの応答をインターセプトし、それらを圧縮するための仲介者サーバーを使用するオプションがあります（これはcould include JavaScriptファイルの縮小）。圧縮はサーバー上（つまりbeforeページをダウンロードした）で行われるため、-inではなく、より小さなファイルをダウンロードすることの潜在的な利点に注意してください。ブラウザ（質問で提案されているように）ファイルをダウンロードしたらこのようなモバイルブラウザには、Opera Mini、および新しいバージョンのGoogle Chrome（少なくともiOSでは、Androidについては不明）が含まれます。詳細については、-を参照してください。 ここ 。

26
Matt

いいえ、すべてのブラウザがJavaScriptを自動的に短縮してパフォーマンスを向上させるわけではありません。

ただし、JavaScriptの場合、 obfuscators と呼ばれるツールと他のツールがあるため、処理速度またはセキュリティの向上のためにコードの可読性/保守性を犠牲にしないでくださいこの目的のために設計された シンカー（またはコンプレッサー） と呼ばれます。

事前に最適化しないでください。ページの読み込み速度が速く、JavaScriptに過度に機密性の高いコンテンツがない場合は、心配する必要はありません。変数に意味のある名前を付けます。コードの可読性は保守性にとって非常に重要であり、滅多になくても犠牲にするべきではありません。

良いJavaScriptコーディング規約への参照が必要な場合は、 these を使用することをお勧めします。

11
CFL_Jeff

ファイルサイズを早めに気にする必要はありません。それは常に懸念事項ですが、読みやすさと保守性はより重要です。

そうは言っても、とにかくスクリプトの minified を（たとえば YUI Compressor を使用して）サービスする必要があります。

Web開発全般のベストプラクティスに興味がある場合は、以下を読むことをお勧めします すべてのプログラマーがWeb開発について知っておくべきことはありますか？

2
Craige

私は長い間JavaScriptで働いていました。

すべての変数に ハンガリー語表記 を使用する必要がある命名基準がありました。

うまく動作したようです。それを使用することに反対の場合があることは知っていますが、それは私たちにとってうまくいきました。特に、ものを見つける必要がある巨大なJavaScriptファイルがある場合。

時期尚早に最適化しないように注意します。非常に高速に実行されない厄介なコードが作成される可能性が非常に高くなります。

1
Alan Delimon

識別子の長さは関係ありません。他の人が言ったように、本番環境では、ミニファイを使用してスクリプトのダウンロード時間を短縮できます。実際、特にJavaScriptは風変わりな言語であり、長い間JavaScriptは仕事を成し遂げるためのものとして無視されてきたため、許容可能なコーディング/命名規則に従う必要があります。命名規則の場所を探している場合は、 Google JavaScript Style Guide が適しています。それは示唆している、

  • functionNamesLikeThis、例：getCashbackData（）{}
  • variableNamesLikeThis、例：var alertInterval = 10;
  • ClassNamesLikeThis、例：var CustomerOrder = {getOrderLines：function（）{}}
  • EnumNamesLikeThis、例：var ColorOfChoice = {White： "#FFFFFF"}
  • methodNamesLikeThis、例：var CustomerOrder = {getOrderLine：function（）{}}
  • SYMBOLIC_CONSTANTS_LIKE_THIS（例：var Epoch_UNIX = "01011970"）
1
theD

「クリーンなコード開発者」の哲学に腹を立てています（上記の投稿から、変数名のサイズを小さくすることでパフォーマンスへの影響がゼロになることを知っているとしたら）私はアドバイスしかできません：

  1. 適切なオートコンプリートとインテリセンス機能を備えた、aptana、netbeans、Eclipse（すべて無料）、または多数の商用製品（iの場合）など、個人の開発ニーズに最適なIDE無料ゲームがあったので、JetBrainsの製品を調べます）

  2. コメントを不必要な方法でコードを記述します。つまり、書く代わりに

    getXy(e) { return [e.pageX, e.pageY ] }

    これは本当に何でも意味するかもしれません（特にjsのようなクレイジーで緩やかに型付けされた言語では）コードをそれ自体で表現します

    getPageCoordinatesFromEvent(event) { 
    return [event.pageX, event.pageY ];
}

    優れたIDEでは、通常、数回文字を入力してオートコンプリートからEnterキーを押すだけの2秒間の変数名を2度入力することはありません。自分ですべての文字を入力することを主張する場合、優れたIDEはとにかくタイプミスに気づくでしょう。これは非常に表面的な例にすぎないため、私は強くお勧めします（批判の形式としてではなく、正直な推奨事項として）

  3. Robert C.Martinの本「Clean Code」またはHunt/Thomasの「Pragmatic Programmer」を入手して、この種の質問を二度としないでください。継続的インテグレーションサーバーでの作業が多すぎて、退屈なテストを自動化できません。 -開発プロセスの一部（ミニファイを含む）を構築し、楽しい部分に集中して、明確に理解できるコードを記述して、優れた機能を実現します。

追伸最新のJavaScriptコードの開発に慣れる必要がある場合は、John "Mr. jQuery" Resigの "Pro Javascript Techniques"の本を上記の直後または上記と一緒にご覧ください。

0
Philzen