ジャバスクリプト — 変数

アマゾンで私の本をチェックしてくださいhttps://www.amazon.com/John-Au-Yeung/e/B08FT5NT62
今すぐ私の電子メールリストを購読http://jauyeung.net/subscribe/
他のプログラミング言語と同様に、JavaScriptはプログラムを読みやすく維持するためにベストプラクティスの独自のリストを持っています.JavaScriptにトリッキーな部分がたくさんあるので、避けるべきことがたくさんあります.
我々はJavaScriptコードを読みやすくするためにいくつかのベストプラクティスに従うことができます.
この記事では、読みやすい方法で変数を宣言する方法を見ています.また、グローバル変数の宣言を避け、外部からプライベート変数を隠す方法を見ます.

グローバル変数を避ける

グローバル変数の使用をできるだけ多くの理由で避ける必要があります.
つは、彼らがどこでも利用可能であるので、彼らが異なる場所で上書きするのが簡単であるということです.彼らはまた、物事を上書きすることができますwindow グローバル変数からのオブジェクトはwindow オブジェクト.
これらの2つのコードは、次のハードを行う本当の問題です.したがって、ローカル変数をできるだけ定義する必要があります.ローカル変数を定義するにはvar , let , or const キーワード.
変数var が定義される前に定義されているレベルで利用可能です.例えば、以下のように書くと
その後、我々は得るundefined 最初にconsole.log と2番目のログの1つ.
書くのと同じです.
で宣言された変数let が定義された後にのみ利用可能です.
エラーが発生しました:

Uncaught ReferenceError: Cannot access ‘x’ before initialization

とconst キーワード、我々は一度だけではなく、二度と割り当てられることができる定数を定義します.それは宣言された後にのみ利用可能ですvar .
例えば、以下のように書くことができます.

const log = () => {  
  console.log(x);  
}

const x = 1;  
log();

呼び出しlog 以前const x = 1 また、

Uncaught ReferenceError: Cannot access ‘x’ before initialization

プログラムの異なる部分で利用可能な変数を必要とするなら、JavaScriptモジュールを使用して、コードを解放するとき、モジュールを一つまたはいくつかの大きなファイルに構築しなければなりません.これはES 6以降で利用可能です.
私たちはexport 変数とimport 他のモジュールでも.またexport default モジュール全体をエクスポートする.この方法では、モジュールの外部で利用できるものをエクスポートし、他のすべてをプライベートにします.
また、外部にアクセスできないように、関数の中で変数を保持するクロージャを使うこともできます.簡単なクロージャの例は次のようになります.

const multiply = () => {  
  const x = 3;  
  return () => x \* 2;  
}

我々は守るx インサイドmultiply 関数は外部にアクセスできず、何かを行う関数を返すことができません.
それから、書くことで呼び出します.

console.log(multiply()());

常にローカル変数を宣言する

corollaryとして、常にローカル変数を宣言する必要があります.ローカル変数と定数を常に宣言する必要がありますvar , let , or const .
それ以外の場合、window 我々は確かにしたくない.
例えば、決して書きません.

x = 1;

代わりに

let x = 1;

幸いなことに、JavaScriptの厳しいモードでは宣言されていない変数を使用できません.
また、JavaScriptモジュールにはデフォルトで有効になっている厳しいモードがあります.
写真でFrancesco De Tommaso をUnsplash

角トップ上の変数と定数宣言のパッキング

トップに変数と定数の宣言を置くと、すべてが上にあるように我々のコードクリーナーになります.また、それを誤って参照して物事を参照してから停止しますlet or const 定義される前に.
strict modeがオフの場合、グローバル変数の定義は避けてください.また、変数の誤って再宣言を避ける.再宣言は多くのテキストエディタによって捕らえられなければなりません、しかし、それはまだ可能性です.
変数名をカンマで区切ることで、1行で複数の変数宣言を行うことができます.例えば、以下のように書くことができます.

let x, y;  
x = 1;  
y = 1;  
console.log(x, y);

次のようになります.

1 1 

からconsole.log .
ループのために同じことができます:

let i;

for (i = 0; i < 10; i++) {  
  console.log(i);  
}

宣言時に変数を初期化する

変数を宣言するときに変数や定数を値で初期化するのは良い考えです.これは、定義されていない値のエラーを防止し、両方の変数または定数を宣言することができますし、初期値を1つの行のすべてに設定します.
さもなければ、変数または定数を宣言するための1行と、その値を設定するための別の行があります.
例えば、以下のように書くことができます.

let x = 1,  
  y = 1;

両方を宣言するx and y .
これは書くよりずっと短い.

let x;  
let y;  
x = 1;  
y = 1;

コンマで各宣言と割り当てを分離することで、複数の変数を宣言して初期化できます.

結論

変数の宣言と初期化のための基本的なベストプラクティスです.
変数をきれいに宣言する方法と、グローバル変数の宣言を避ける方法を見ました.より多くのために調整されるので、きれいなJavaScriptプログラムを書くことは、より多くあります.