私たちは、他のすべての人と同様に、最初は開発中のコードを書くための標準を使用していましたが、実際には次のようなものに限定されていました。
-キャメルケースで書いていますか？
-はい、いつものように、キャメルケースで
... 2週間が経過しました...
-まあ、私たちはラクダケースで同意しました!!!
私たちの場合、おそらく最後のフレーズはそうではありませんでした。
長い間、これを何らかの形で体系化したかったのですが、私の手はjQuery、Google、ideomatic.js、Crockfordのスタイルの選択に至りませんでした。
AirBnBのリーダーシップが1か月以上前にトレンドのgithubに入ったとき、すぐに目を引きました...
1週間前、私たちは主に自分のニーズのために翻訳しましたが、コミュニティと共有することはできませんでした。
- オリジナル： https : //github.com/airbnb/javascript
- 翻訳： https : //github.com/uprock/javascript
少なくともすべての初心者js開発者に読むことを強くお勧めします。
他のマニュアルとどのように違うのですか？
実際には、コードのスタイルを設定する方法を示すだけでなく、JavaScriptで正しく記述する方法を示します。 これはJSLintの指示のリストであるだけでなく、うまく書き始めるためのプラットフォームです。このテキストは1時間で思慮深く読むことができ、訓練生は1日の試行錯誤や上級仲間への質問よりもJavaScriptをよりよく理解できます。
設計に関しては、このガイドでは「一般的な」選択肢を使用しています。
例：
Google、npm、Node.js、Idiomaticでも2スペースタブが使用されます
Google、Node.js、Crockfordのように、常にセミコロンを使用します
慣用的なjQueryのように、1つの変数にぶら下がりコンマを使用して変数を宣言する
興味深いことに、ここでも同様の瞬間が示されています。
最後に値が割り当てられていない変数を宣言します。 これは、すでに割り当てられている値に基づいてこれらの変数のいずれかの値を設定する必要がある場合に便利です。
変数のキャメルケース-Google、npm、Node、Idiomaticなど
同時に、このガイドでは以下を明示的に示しています。
camelCaseを使用して、オブジェクト、関数、変数に名前を付けます。
PascalCaseを使用して、クラスコンストラクターに名前を付けます。
たとえば、次のようないくつかのポイントが明確かつ明確に説明されています。
オブジェクトの最後の余分なコンマ：なし。 互換モードのIE6 / 7およびIE9で問題を引き起こす可能性があります。 一部のES3実装では、配列の末尾のコンマが長さを1増やして、問題を引き起こす可能性があります。 この質問はES5（オリジナル）でのみ明確になりました：
ECMAScript 5エディションは、ArrayInitialiserの末尾のコンマが配列の長さを増加させないという事実を明確に確立しています。 これはECMAScript 3 Editionからのセマンティックではない変更ですが、以前は一部の実装でこの問題が誤って解決されていました。
スコープ内の変数と関数の宣言の「浮上」のメカニズムが明確に説明されています。
無名関数の宣言は、変数自体をスコープの一番上に上げますが、値は上げません。
名前付き関数は、変数をスコープの先頭に移動しますが、値は移動しません。 関数の名前は変数のスコープでは使用できず、内部からのみアクセスできます。
関数宣言は、名前とその意味の両方を現在のスコープの先頭に上げます。
各例は、コードのテストブロックによって明確かつグラフィカルに示されています。パフォーマンスまたはパフォーマンス上の理由から選択された多くの事項には、jsPerf、ECMAScript仕様（簡単な説明を必要としない信じられない退屈な人々向け）、またはこの主題に関するいくつかの非常に興味深い記事へのリンクが付随しています。
一般的に-少なくともこれは非常に興味深い読み物であり、コードの記述スタイルを正式に計画しているのであれば、今がその時です。
このセットには、他のメインガイドへのリンクのセット、このスタイルのコードを既に使用しているコマンドのリスト、読む価値のあるサイト、さらに多くの有用なリンク、そして最も重要なのは、SublimeのJSLintの構成が含まれています。
最も忙しい人向けのコンテンツの簡単な概要を次に示します。
- オブジェクトと配列を作成するには、常に短い構文を使用してください。
- 文字列の場合、単一引用符を使用します。文字列の最大長は80文字で、ハイフネーションは+です。
- ブロックの先頭にある変数（および関数）のすべての宣言。コンマで区切られ、1つのvarから関数全体まで。 関数宣言（割り当てではない）は条件ブロックでは許可されません。
- 値が割り当てられていない変数は、変数宣言の最後に移動します。
- オブジェクトのプロパティとメソッドへのアクセスは常にピリオドを通じて可能です。ユーザー['get']のようなリクエストは禁止されています（コードの特別なものに必要ない場合）。
- 常に厳密な同等性を確認し、型キャストを使用してください。
- 中括弧は、複数行のコードブロック専用です。 新しい行からステートメントが1つある場合は、{}でラップする必要もあります。
- 複数行コメントは常に/ ** * /を使用し、JSDocを使用します。
- //のみの単一行コメントは、常に説明の前にあり、1行の空行が先頭にあります。
- タブ-2つのスペース。常に1つのスペースと開始ブラケット。
- 呼び出しチェーンで論理インデントを使用し、各行を新しい行で呼び出します。 そのため、たとえばjQueryでは、ターゲットブロック（.find、.closest、.childrenなど）の各変更の前後にostupが配置されます。
- セミコロン-必要な場所。
- 操作の開始時に可能な限り型の強制、数値の場合は常にparseIntまたはNumberを使用します。 キャストのためのビット単位の操作は速度上許容されます。そのような各操作についてコメントする必要があります。
- すべての関数には、すべての変数と関数にはcamelCase、コンストラクターにはPascalCaseという名前が付けられます。 プライベートメソッドとプロパティの場合、最初に「_」を設定します
これを参照するには、_thisを使用します。
- ユニバーサルアクセサは使用されず、ゲッターとセッターが各プロパティに割り当てられるか、共通の.getと.setが作成されます。
プロトタイプの交換は悪であり、プロトタイプは拡張のみ可能です。
- イベントは常にオブジェクトとして渡されるため、上昇中にイベントを展開できます。
- jQuery変数には接頭辞$が付いています。
独自の説明ブロックをいくつか追加し、1つの変更を加えました：オリジナルは// FIXMEおよび// TODOコメントを使用して提案しましたが、IDEおよびコードエディターは通常// TODOのみを強調表示するため、// FIXMEの代わりに// TODO FIXMEを使用することをお勧めします自動生成されたインデックスのナビゲーションを簡単にするため。
念のため、リンクを複製します。
- オリジナル： https : //github.com/airbnb/javascript
- 翻訳： https : //github.com/uprock/javascript