JavaScriptコードの仕様


すべてのJavaScript 同じ基準がプロジェクトに適用されます。

JavaScript コード仕様

コード仕様には通常、次の側面が含まれます:

  • 変数と関数の命名規則

  • スペース、インデント、およびコメントの規則。

  • その他の一般的に使用される仕様...

標準コードは読みやすく、保守しやすい場合があります。

コード仕様は通常、開発前に規定され、チームメンバーと交渉して設定できます。

変数名

変数名にはキャメルケースを使用することをお勧めします (camelCase):

firstName = "John";
lastName = "Doe";

price = 19.90 ;
Tax = 0.20;

fullPrice = 価格 + (価格 * 税);

スペースと演算子

通常の演算子 ( = + - * / ) は前後にスペースを追加する必要があります:

例:

var x = y + z;
var 値 = ["ボルボ", "サーブ", "Fiat"];

コードのインデント

通常、コード ブロックをインデントするには 4 つのスペース記号を使用します:

Function:

function toCelsius(fahrenheit) {
return ( 5 / 9) * (華氏 - 32);
}
Note 編集者によって TAB キーの解釈が異なるため、インデントに TAB キーを使用することはお勧めできません。

ステートメントのルール

単純なステートメントの一般的なルール:

  • ステートメントは通常、記号で終わります。

例:

var 値 = ["Volvo", "Saab", 「フィアット」];

var person = {
名: 「ジョン」,
姓: "Doe"、
年齢: 50、
目の色: "blue"
};

複雑なステートメントの一般規則:

  • 最初の行の最後に左中括弧を置きます。

  • 左中括弧の前にスペースを追加します。

  • 閉じ中括弧を独自の行に配置します。

  • 複雑なステートメントをセミコロンで終わらせないでください。

関数:

関数 to摂氏(華氏) {
return (5 / 9) * (華氏 - 32);
}


ループ:

for (i = 0; i < 20) {
挨拶 =
「こんにちは」
;
}

else
{

挨拶 =
"こんばんは"

;

}
オブジェクトのルール
オブジェクト定義のルール:
左中括弧はクラス名と同じ行に置きます。
コロンと属性値の間にはスペースがあります。
数値ではなく文字列に二重引用符を使用します。

最後の属性と値のペアの後にカンマを追加しないでください。

  • 右中括弧を独自の行に配置し、記号で終了します。

    • 例:

  • var
    • person = {
  • 名:

    "John"

    ,
    • 姓:
  • "Doe"

    、

    年齢:
    • 50
、
目の色:

「青」

};

短いオブジェクト コードは 1 行で直接記述できます:

例:

var person = {firstName:"John", lastName:"Doe", age:50, eyeColor: "blue "};

コードの各行の文字数は 80 文字未満である必要があります

読みやすさを考慮して、各行の文字数は 80 文字未満であることをお勧めします。

JavaScript ステートメントが 80 文字を超える場合は、演算子またはカンマの後で改行することをお勧めします。

インスタンス

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<h1>我的 Web 页面</h1>
<p>
建议在运算符或者逗号后换行。
</p>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML =
    "Hello php.";
</script>

</body>
</html>

インスタンスの実行»

「インスタンスの実行」ボタンをクリックしてオンラインインスタンスを表示します

命名規則

一般に、多くのコード言語の命名規則は似ています。例:

  • 変数と関数はハンプメソッド (キャメルケース )

  • グローバル変数は大文字 (大文字 )

  • 定数 (PI など) は大文字 (大文字 ) )

これを使用するかどうかという名前の差異 いくつかのルール: hyp-hens、camelCase、または under_scores ?

HTML および CSS のクロスバー (-) 文字:

HTML5 属性を開始できますdata- (例: data-quantity、data -price) をプレフィックスとして付けます。

CSS は、プロパティ名 (フォント サイズ) を接続するために - を使用します。

Note - 一般に JavaScript では減算とみなされ、その使用は許可されません。

アンダースコア:

多くのプログラマーは、特に SQL でアンダースコア (date_of_birth など) を使用することを好みます。 データベース内で。

PHP言語は通常アンダースコアを使用します。

PascalCase:

PascalCase は C 言語でより一般的です。

CamelCase:

CamelCase は JavaScript で一般的に推奨されており、jQuery および他の JavaScript ライブラリは CamelCase を使用します。

Note多くの JavaScript ライブラリと競合するため、変数名を $ で始めないでください。

HTML は外部 JavaScript ファイルを読み込みます

簡潔な形式を使用して JavaScript ファイルを読み込みます (type 属性は必要ありません):

<script src="myscript.js">

JavaScript を使用して HTML 要素にアクセスします

HTML の形式が不適切であると、JavaScript 実行エラーが発生する可能性があります。

次の 2 つの JavaScript ステートメントは、異なる結果を出力します:

インスタンス

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="Demo">段落 1。</p>
<p id="demo">段落 2。</p>
<script>
// 只有段落 2 会被替换
document.getElementById("demo").innerHTML = "HELLO.";
</script>

</body>
</html>

インスタンスの実行 »

オンラインの例を表示するには、[インスタンスの実行] ボタンをクリックしてください

同じ命名規則を使用してみてください。 HTML と JavaScript。

HTML(5) コーディング仕様にアクセスします。

ファイル拡張子

HTML ファイルの拡張子は、.html (または r .htm) です。

CSSファイルの拡張子は.cssです。

JavaScript ファイルのサフィックスは .js です。

ファイル名は小文字を使用してください

ほとんどの Web サーバー (Apache、Unix) は大文字と小文字を区別します。London.jpg を介して london.jpg にアクセスすることはできません。

他の Web サーバー (Microsoft、IIS) は大文字と小文字を区別しません。london.jpg には、London.jpg または london.jpg 経由でアクセスできます。

一貫したスタイルを維持する必要があり、小文字のファイル名を一律に使用することをお勧めします。


←