JavaScript変数と関数の保護について

護衛とは何ですか?

事前定義:アップグレード

HoistingはJSのユニークな特徴で、関数内の変数と関数宣言を各有効範囲の最上位に引き上げます.
実際には,コードが昇格されるのではなく,JavaScript解析器によって内部昇格されて処理される.
コンパイルフェーズでコード実行前の関数と変数宣言をスキャンし、すべての関数と変数宣言をディレクトリ環境と呼ばれるJavaScriptデータ構造内のメモリに追加します.

console.log(a); // undefined
var a = "A"; // var 변수 

/* 호이스팅 된 코드 */
var a; 
console.log(a);
a = "A";

var a上端に記号が付けられているため、変数を宣言する前にconsoleを使用します.log出力でエラーは発生せず、Undefined出力です.
すべての宣言(function、var、let、const、class)はJavaScriptで呼び出され、var宣言はundefinedに初期化されますが、letおよびconst宣言は初期化されていない一時的なDead Zone状態を維持します.

JavaScriptで変数を作成するには

javascriptでは、変数を作成するには3つのステップが必要です.

宣言(Declaration):scopeと変数オブジェクトを生成し、scopeは変数オブジェクトを参照します.初期化前はTDZ状態であった.

初期化:変数オブジェクト値にメモリ領域を割り当てます.この時点で割り当てられた値は定義されていません.myValue = undefined

割当て

:変数オブジェクトの値の割当てmyValue = 150

リモート環境

// 선언
lexicalEnvironment = {
  a: <uninitialized>
}
// 초기화
lexicalEnvironment = {
  a: undefined
}
// 할당
lexicalEnvironment = {
  a: 10
}

var, let, const

varは宣言と同時に初期化された.すなわち,宣言と同時に未定義のものを割り当てる.
しかしletとconstは違います.初期化されていないメモリ割り当ては、初期化されていないTDZに入ることを宣言するだけです.
すべての宣言(function、var、let、const、class)はJavaScriptで呼び出され、var宣言はundefinedに初期化されますが、letおよびconst宣言は初期化されていません.

undefined vs ReferenceError

console.log(hoist); // Output: undefined
var hoist = 'The variable has been hoisted.';

console.log(hoist); // Output: ReferenceError: hoist is not defined ...
let hoist = 'The variable has been hoisted.';

let、constもHostingになりますか?

var hoist = "AA";

(function func() {
  console.log(hoist); // Output: ReferenceError
  let hoist = "BB";
})();

letとconstが互換性がない場合は、console.log(hoist)は「AA」を出力する必要がありますが、ReferenceErrorが生成されます.つまり、letとconstも選択されます.

関数宣言

関数宣言式は記号付きです.

hoisted(); // Output: "This function has been hoisted."

function hoisted() {
  console.log('This function has been hoisted.');
};

関数式

関数式には記号を付けません.

expression(); //Output: "TypeError: expression is not a function

var expression = function() {
  console.log('Will this work?');
};

関数式と関数宣言式を組み合わせても、同じようにハイライトされません.

expression(); // Ouput: TypeError: expression is not a function

var expression = function hoisting() {
  console.log('Will this work?');
};

クラス宣言(宣言)

JavaScriptのクラス音明式はエスケープされ、初期化されていない「TDZ」状態が維持されます.したがってclassにアクセスするには、まず宣言する必要があります.

var Frodo = new Hobbit();
Frodo.height = 100;
console.log(Frodo); // Output: ReferenceError: Hobbit is not defined

class Hobbit {
  constructor(height) {
    this.height = height;
  }
}

クラス式

関数式のようにclass式はネストされません.

var Square = new Polygon();
Square.height = 10;
console.log(Square); // Output: TypeError: Polygon is not a constructor

var Polygon = class Polygon {
  constructor(height) {
    this.height = height;
  }
};

n/a.結論

Hoistingは、関数宣言がどこにあるかにかかわらず、必要な場所で関数を自由に使用するために作成された機能です.しかし、この機能は思わぬバグを生じることがある.したがって、意図的にシースを使用しない場合は、シースを使用しないか、Temporal Dead Zoneで初期化されたlet、const、関数式を使用することをお勧めします.