ホームページ  >  記事  >  ウェブフロントエンド  >  JavaScriptコーディング標準の推奨_基礎知識

JavaScriptコーディング標準の推奨_基礎知識

WBOY
WBOYオリジナル
2016-05-16 17:53:131172ブラウズ
1. 名前付け
1. 変数と関数に意味のある名前を付けます。ランダムに名前を付けないでください。
2. 非コンストラクター関数はキャメルケースの名前を使用し、getName や IsFull などの変数名と区別するために動詞とオブジェクトの構造を使用するようにします。コンストラクター (カスタム型) 名の最初の文字は、パーソンなどの非コンストラクター関数と区別するために大文字で表記されます。
3. 変数にはキャメルケースの名前が使用されます。 JavaScript は型指定が弱い言語であるため、変数名に接頭辞として整数 (i)、浮動小数点数 (f)、ブール値 (b)、文字列 (s)、配列 (a) を付けることをお勧めします。ただし、これを行うことは必須ではありません。個人の好みに応じて選択できます。プレフィックスを追加する方法とプレフィックスを追加しない方法を混合しないでください。

2. レイアウト
1.
a) var と変数名の間にスペースを入れ、変数名と等号の間にスペースを入れ、等号と初期値の間にスペースを入れ、初期値とセミコロンの間にスペースを入れないでください。例: var i = 10;
b) リテラルを使用して参照型変数を宣言する場合は、各属性とコロンの間にスペースを入れず、コロンと初期値の間にスペースを入れます。例:
コードをコピー コードは次のとおりです:

var Person = {
age: 16 ,
name: "Sam"
};

c) 関数と関数名の間にはスペースを入れ、関数名と ()、() との間にはスペースを入れないでください。 { 間にはスペースを入れてください。
d) 関数の各パラメータの間にスペースを入れます。
e) キーワードを強調するには、if、while、for と左括弧の間にスペースを入れます。switch、with と左括弧の間にはスペースを入れません。
f) 二項演算子と左右のオペランドの間にスペースを入れます。コード行が長い場合、スペースを入れることはできません。
2.改行。
a) 各ステートメントは 1 行を占めます。1 行に複数のステートメントを使用しないでください。
b) if、while、for などのブロックレベルのスコープの後の中括弧 { は新しい行で開始せず、キーワードと同じ行に置くだけです。
3. インデント。
a) インデントには 4 つのスペースを使用し、タブは使用しないでください。
b) スコープが異なる場合は、階層関係を示すためにインデントする必要があります。

3. コメント
1. コメントを適切に追加します。コメントがまったくないわけではありませんし、多ければ多いほど良いというわけでもありません。重要なメソッド、変数、アルゴリズム (または注意が必要なその他の問題) にコメントを追加するだけです。
2. ソースコードを変更するときは、一貫性を保つためにコメントも同時に変更する必要があります。
3. コード内で HTML コメントを使用しないでください。

4. 仕様
1. 変数宣言時に var キーワードを追加する必要があります。 JavaScript では var キーワードを省略してグローバル変数にすることができますが、これは問題の原因になります。
2. 変数を宣言するときは、同時に初期化する必要があります。後から変数のデータ型を変更しないことをお勧めします。
3. ステートメントの最後にセミコロンを追加できる場合は、必ず追加する必要があります。
4. while、for などのステートメントが 1 つしかない場合も、中括弧で囲む必要があります。
5. グローバル変数を任意に使用しないでください。使用する必要がある場合は、グローバル変数を 1 つだけ使用することをお勧めします。
6. JavaScript は html および css と疎結合する必要があります。 HTML はデータ層、CSS はプレゼンテーション層、JavaScript は動作層です。これら 3 つの密接な結合は避けるべきです。そうしないと、後で保守することが困難になります。 HTML には特定の JavaScript コードを含めるべきではなく、すべての外部ファイルを JavaScript に含める必要があります。多数の HTML 要素を挿入するために innerHTML を使用しないようにしてください。ただし、最初は非表示にするだけです。 JavaScript を直接使用しないでください。 CSS の特定のプロパティを変更するには、className を通じて間接的に変更する必要があります。
7. 自分が所有していないオブジェクトを変更したり、そのインスタンスやプロトタイプにプロパティやメソッドを追加したり、既存のメソッドを繰り返し定義したりしないでください。そうしないと、オブジェクトの新しいバージョンが同じ名前のプロパティまたはメソッドを追加したときに、潜在的に微妙な問題が発生する可能性があります。解決策は 2 つあります。1 つは継承で、もう 1 つは包含です。
8. 複数のライブラリ間の競合を防ぐために名前空間を使用する YUI ライブラリの構成を参照してください。
9. コード内に出現するリテラルは、属性名の最初の文字またはすべての文字を大文字にして、変数の属性に配置する必要があります (他の言語の定義または列挙をシミュレートします)。例:
コードをコピー コードは次のとおりです:

var Color = {
赤: 1 、
青: 2、
緑: 3
};
10. Check the parameters passed in the function. If it is a basic type, use typeof; if it is a reference type, use instanceOf; if you want to check whether an object contains a method, use the typeof operator on the method and compare it with the string "undefined".

5. Performance
1. Avoid global search. Using global variables and functions is more expensive than using local variables and functions because global variables and functions involve scope chain lookups. Therefore, when a global variable is used multiple times in a function, multiple scope chain searches will be performed. In order to avoid this problem, the global variable used multiple times can be assigned to a local variable, and the local variable will be used in the future.
2. Avoid using witch statements. The with statement creates its own scope, causing additional overhead.
3. Avoid attribute lookup. Property lookup is an O(n) operation, and any property lookup on an object takes more time than accessing variables and arrays (accessing variables and arrays is an O(1) operation). Therefore, if the same property is used multiple times, it should be saved in a local variable. For example:
Copy code The code is as follows:

var sUrl = window.location.href;
var sData = sUrl.substring(sUrl.indexOf("?"));
声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。