コーディング作業のためのJavaScriptプログラミング仕様のまとめ - Google版

JavaScript コード仕様 (Google)

変数には var キーワードを使用する必要があります

var が記述されていない場合、変数はグローバル コンテキストで公開され、既存の変数と競合する可能性があります。

定数宣言では大文字が使用され、NAMES_LIKE_THIS のようにアンダースコアで区切られます。

セミコロン、暗黙的な区切りを避けるために、常にセミコロンを使用してください

ネストされた関数が使用できる

ブロック内で関数を宣言しないでください

if(x){
function foo(){

}
}
// 这种容易出问题

標準機能は常に非標準機能よりも優れています

たとえば、string[3] の代わりに string.charAt(3) を使用します。

プリミティブ型をラップしないでください

// 不能去封装基本类型,下面做法是不被允许的
var x = new Boolean(false);

多層プロトタイプ構造

マルチレベル プロトタイプ構造とは、JavaScript の継承関係を指します。クラス D をカスタマイズし、クラス B をそのプロトタイプとして使用すると、マルチレベル プロトタイプ構造が得られます。

継承を直接定義しないようにしてください。

メソッド定義

// 如下形式给构造器添加方法或成员
Foo.prototype.bar = function(){
    /*...*/
}

閉鎖

クロージャの正式な説明は、多くの変数とこれらの変数をバインドする環境を含む式 (通常は関数) であり、したがってこれらの変数も式の一部となります。例は次のとおりです


var Circle = function() {   var obj = new Object();
   obj.PI = 3.14159;
   obj.area = function( r ) {
       return this.PI * r * r;
   }
   return obj;
}
var c = new Circle();
alert( c.area( 1.0 ) );
这种写法是声明一个变量,将一个函数当作值赋给变量。

クロージャは注意して使用する必要があります。クロージャはその外側のスコープへのポインタを保持するため、クロージャを DOM 要素にアタッチすると循環参照が生成され、さらにメモリ リークが発生する可能性があります。たとえば、次のコード

function foo(element,a,b){
    element.onclick = function{/* uses a and b */};
}
// 上述即使没有使用element,闭包也保留了element,a和b的引用。由于element也保留了对闭包的引用,这就产生了循环引用,因此不能被GC回收。可以将代码重构为以下形式
function foo(element,a,b){
    element.onclick = bar(a,b);
}
function bar(a,b){
    return function(){ /* uses a and b*/}
}

eval() は注意して使用してください

eval() はプログラムの実行をさらに混乱させますが、 eval() にユーザー入力が含まれる場合はさらに危険です。
ただし、シリアル化された文字列を解析する必要がある場合は、eval を使用できます。

with(){} は使用しないでください

//使用with会让你的代码在语义上变得不清晰,因为with的对象,可能会与局部变量产生冲突,从而改变你程序原本的用意

これはオブジェクトのコンストラクター、メソッド、クロージャーでのみ使用されます。

for-in ループ。オブジェクト/マップ/ハッシュのトラバーサルにのみ使用されます。

// 对array使用for-in循环有时会出错,因为for-in不是从0到len-1遍历的,而是所有出现在对象及其原型链的键值。失败案例如下:
function prinArray(arr){
    for(var key in arr){
        print(arr[key])
    }
}
printArray([0,1,2,3]);
var a = new Array(10);
printArray(a);//运行就出错了

複数行の文字列は使用しないでください

// 它不是ECMAScript的标准规范,所以这种写法容易出现奇怪的错误。
var ms = 'fsfsdfds\
sdfdsfsd\
fdsfs
'

配列およびオブジェクトのコンストラクターの使用を避ける

//以下代码在构造器里传入数据时可能会出现问题
var a = new Array(x1,x2);
var o = new Object();
//最好都改成直接量
var a = [x1,x2];
var o = {};

JavaScriptのコーディングスタイル

名前

  1. プロパティとメソッド
  • クラス内のプライベート プロパティ、変数、メソッドはアンダースコア「_」で始まる必要があります
  • クラス内の保護されたプロパティ、変数、メソッドはパブリック変数と同じ名前を持ちます
  1. メソッドと関数のパラメーター オプション
    のパラメーターは opt_ で始まり、関数パラメーターの数は可変で、最後のパラメーター var_args はパラメーターの数です。
  2. Getter と Setter は、
    get/set+ パラメータの大文字で名付けられます。たとえば、getName()/setName()
  3. グローバルコードネーミング
//使用一个唯一的,与工程/库相关的名字作为前缀标识。例如工程是Project Sloth,那么命名为sloth.*。具体示例如下
var sloth = {};
sloth.sleep = function() {
...
};
  1. 外部コードと内部コードは異なる名前空間を使用します

外部コードとは、コード システムの外部から取得され、独立してコンパイルできるコードを指します。外部コードが foo.hats.* にある場合、独自のコードに foo.hats.* の下に名前を付けることはできません。

  1. 名前空間へのエイリアスを作成しないでください
  2. ファイル名には小文字を使用し、- と _ 以外の句読点は使用しないでください (- は _ よりも優れています)

変数は遅延初期化可能

コードのフォーマット

  1. 平行挿入ブレース
if (something) {
}
  1. 配列とオブジェクトの初期化
  • 長さは長くなく、一行で書けます
  • 初期値は複数行を占め、スペース 2 つでインデントされます。
  • 初期値を手動で調整しようとしないでください
  1. 関数のパラメータは
    できる限り同一行に配置し、1行が80文字を超える場合はスペース4つでインデントするか、括弧で揃えてください。
  2. 匿名関数の受け渡し
    関数本体は、関数キーワードからではなく、関数呼び出しの左からスペース 2 つ分インデントされます。例は次のとおりです
var names = items.map(
    funtion(item){
        return item.name;
    };
)
  1. 空行を使用して、論理的に関連するコード フラグメントのグループを分割します。
  2. 二項演算子と三項演算子
    例を直接参照する
var x = a ? b : c;
var y = a ?
    LongButSimpleOperandB : LongButSimpleOperandC 

一重引用符は二重引用符よりも優れています

可視性

JsDoc で @private と @protected の 2 つのタグを使用すると、@private とマークされたグローバル変数と関数は、現在のファイル内でのみアクセスできることを示します。@private とマークされたコンストラクターは、クラスが現在のファイルまたはその静的/通常のメンバーでのみインスタンス化できることを示します。

また、グローバル変数、関数、またはコンストラクターを @protected でマークしないでください。

注記

  1. プリミティブ型の定数アノテーションの場合は、単に型を指定します。
/**
* 一分钟的秒数
* @type {number}
SECONDS_IN_A_MINUTE = 60
  1. 非プリミティブ型の定数アノテーションの場合は、 @const タグを使用します。
/**
* 秒数对应的时间列表
* @type {Object.<number>}
* @const
SECONDS_TABLE = {
    minute:60,
    hour:60*60,
    day:60*60*24
}
  1. ファイルのコメント
    最上位の開始コメントは、コードに詳しくない読者にこのファイルに何が含まれているかを伝えるために使用され、ファイルの一般的な内容、作成者、依存関係、および互換性情報を提供する必要があります。次のように:
// Copyright 2009 Google Inc. All Rights Reserved

/**
* @fileoverview 文件描述,他的使用和必要信息
* 存在的依赖
* 作者
  1. クラス アノテーション
    クラス アノテーションは、クラスの機能と使用法を説明し、コンストラクターのパラメーターも説明する必要があります。クラスが他のクラスから継承する場合は、@extends マークを使用する必要があります。クラスがインターフェイスの実装である場合、アプリケーションは@implements マークを使用する必要があります。例は次のとおりです。
/**
* 类的功能
* @param {string} arg1 参数一的描述
* @param {Array.<number>} arg2 参数二的描述
* @constructor
* @extends {goog.Disposable}
  1. メソッドと関数に関するコメント
    パラメーターの説明を提供し、完全な文章を使用し、三人称で説明を記述します。
/**
* 函数功能描述
* @param {string} arg1 参数一的描述
* @param {Array.<number>} arg2 参数二的描述
* @return {string} 返回值描述
  1. 属性コメント
    パラメータの説明を提供し、完全な文を使用し、三人称で説明を記述します。
/**
* 参数描述
* @type {string} 值描述
  1. 型キャスト注釈
    型タグ注釈を追加して、式と型注釈を括弧で囲む必要があることを明確にします。
/** @type {number} */ (x)

おすすめ

転載: blog.csdn.net/weixin_44077556/article/details/128975119