ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScript コーディングをより標準化する

JavaScript コーディングをより標準化する

黄舟
リリース: 2017-03-24 14:59:07
オリジナル
1103 人が閲覧しました

実際の仕事では、機能的には問題ないものの、コーディングスタイルや仕様が非常に貧弱なコードがよく見られるはずです。これにより、読み進めるのが怖くなったり、その日の読者の気分に影響を与えたりすることさえあります。この記事の目的は、適切なコーディング スタイルを開発できておらず、対応するコーディング標準への認識が不足している JavaScript 学習者がコーディング イメージを改善できるように支援することです。

はじめに

実際の仕事では、機能的には問題がないものの、コーディングスタイルや仕様が非常に貧弱であることがよくあります。一日を通しての読者の気分。これらのコードは、読みにくいだけでなく、保守も困難です。通常、プログラミングを始めたばかりの初心者、または数年間働いている経験豊富なプログラマーによって作成されます。したがって、この記事の目的は、適切なコーディング スタイルを開発できておらず、対応するコーディング標準への認識が不足している JavaScript 学習者がコーディングのイメージを向上させることを支援することです。

コーディングイメージ

私は上記でコーディングイメージの概念を提唱しましたが、私は個人的に次のように考えています:

コーディングイメージ = コーディングスタイル + コーディング仕様 良いコーディングイメージは、身なりの良い若者に等しい。プログラマーにとって、これは同僚があなたの優れた能力を理解する最も直接的で簡単な方法です。

悪いコーディング画像を見てみましょう:

//打个招呼
function func(){
 var age=18,sex='man';
 var greeting='hello';
 if(age<=18&&sex==&#39;man&#39;){
 console.log(greeting+&#39;little boy&#39;)
 }
 ...
}
func()
ログイン後にコピー

上のコードはすべて縮小されており、標準を意識していないため、読むのに耐えられません。

もう一度良いコード イメージを見てみましょう:

// 打个招呼
function greetFn() {
 var age = 18,
 sex = &#39;man&#39;,
 greeting = &#39;hello&#39;;
 if (age <= 18 && sex === &#39;man&#39;) {
 console.log(greeting + &#39;little boy&#39;);
 }
 ...
};
greetFn();
ログイン後にコピー

上記のコードはより快適に感じられますか?

良いコーディングイメージを作成することが重要であることがわかります。この記事では主に JavaScript に基づいたコーディングイメージ、つまり JavaScript ベースのコーディングスタイルとコーディング仕様について説明します。

それでは、コーディングスタイルとは何ですか、コーディング仕様とは何ですか、そしてその2つの違いは何ですか?

コーディングスタイル

まず、コーディングスタイルはスタイルなので、正しいとか間違っているということはありません。人それぞれ服装が異なるのと同じように、より適切な服装をする人もいれば、よりカジュアルな服装をする人もいます。

JavaScriptのコーディングスタイルには、比較的まともなスタイルもありますが、特にチーム開発では、自分のスタイルを自由に書くことはできません。

以下にいくつかのカジュアルなコーディング スタイルをリストし、それらを優れたコーディング スタイルと比較します。

1. 適度な注釈rreerree

2. 適度な間隔

3. 適度なインデント

rrリーリー

4. 合理的な空行

リーリーリー

5. 合理的なネーミング

// 不推荐的写法
var name = &#39;劳卜&#39;;//代码和注释之间没有间隔

if (name) {
 /*
 *注释之前无空行
 *星号后面无空格
 */
}
ログイン後にコピー
// 推荐的写法
var name = &#39;劳卜&#39;; // 代码和注释之间有间隔

if (name) {
 /*
 * 注释之前有空行
 * 星号后面有空格
 */
}
ログイン後にコピー

6. 合理的なステートメント

// 不推荐的写法
var name=&#39;劳卜&#39;; // 等号和两侧之间没有间隔

// if块级语句间没有间隔
if(name){
 console.log(&#39;hello&#39;);
}
ログイン後にコピー
// 推荐的写法
var name = &#39;劳卜&#39;; // 等号和两侧之间有间隔

// if块级语句间有间隔
if (name) {
 console.log(&#39;hello&#39;);
}
ログイン後にコピー

7. 合理的な終わり方

// 不推荐的写法:没有合理缩进
function getName() {
console.log(&#39;劳卜&#39;); 
}
ログイン後にコピー
// 推荐的写法:合理缩进
function getName() {
 console.log(&#39;劳卜&#39;);
}
ログイン後にコピー
上記では、主に比較のために一般的なコーディング スタイルの 7 つの例を示しています。権利がないとか、推奨される記述方法と推奨されない記述方法の違いは、推奨される記述方法の方が読みやすく、保守しやすく、チーム開発により適しており、また、優れたコーディングのイメージを反映しているというだけです。

コーディング仕様書

コーディング仕様書については、仕様書なので一定のルールに従って記述する必要があります。コーディング標準に違反するコードを無作為に記述すると、プログラム エラーや潜在的なバグが発生する可能性があるため、コーディング スタイルよりも厳格である必要があり、コーディング標準にコーディング スタイルを含める人もいます。

一般的なコードの例をいくつか示します:

1. パラメーターを比較します

// 不推荐的写法: 代码功能块之间没有空行
function getName() {
 var name = &#39;劳卜&#39;;
 if (name) {
 console.log(&#39;hello&#39;);
 }
}
ログイン後にコピー
// 推荐的写法:代码功能块之间有空行
function getName() {
 var name = &#39;劳卜&#39;;

 if (name) {
 console.log(&#39;hello&#39;);
 }
}
ログイン後にコピー

3. eval は注意して使用してください

リーリー

4. タイプを決定します

// 不推荐的写法
var getName = &#39;劳卜&#39;; // 变量命名前缀为动词

// 函数命名前缀为名词
function name() {
 console.log(&#39;hello&#39;);
}
ログイン後にコピー
// 推荐的写法
var name = &#39;劳卜&#39;; // 变量命名前缀为名词

// 函数命名前缀为动词
function getName() {
 console.log(&#39;hello&#39;);
}
ログイン後にコピー

5.

属性を検出します

// 不推荐的写法:函数在声明之前使用
getName(); 

function getName() {
 console.log(&#39;hello&#39;);
}
ログイン後にコピー
// 推荐的写法:函数在声明之后使用
function getName() {
 console.log(&#39;hello&#39;);
}

getName();
ログイン後にコピー
上記は主に、独自のコードを合理的に標準化することで、不要なメンテナンスコストと潜在的なバグを大幅に削減できる 5 つの一般的な例を示しています。 JavaScript 学習者はリスクに留意する必要があります。

結論 「プログラムは人が読むために書かれたものであり、コンピュータによって時々実行されるだけです。」 一時的な利便性のためだけで自分のコードのイメージを破壊することはできません。プロジェクト全体に必要なトラブル。

以上がJavaScript コーディングをより標準化するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート