JS[クリアコード]|コードと関数式

ハウスティンとは何ですか。

コード作成はJavaScript固有の特性であり、コードの最上位に宣言されたように動作します.

変数の宣言と割り当て

JavaScriptは、宣言と割り当てを分離します.

宣言:実行時より前の

割当て

:実行時

JavaScriptエンジンは、ソースコードからすべての宣言(変数宣言、関数宣言など)を見つけ、実行時の前にこれらの宣言を実行します.これらの評価が完了すると、すべての宣言を除いて、ソースコードは実行時と呼ばれる行を順次実行します.ソースコードが順次実行される時点での実行時に値割り当てを実行します.
関数宣言実行時より前にJavaScriptエンジンによって最初に関数オブジェクトが生成されたことを宣言します.したがって、実行時に関数宣言文の前に関数を参照および呼び出すことができます.これを関数反発と呼ぶ.

へんすうかそく

console.log(a); //undefined

let a=10;

console.log(a); //10

宣言は実行時より前に実行されるため、変数宣言の前にコンソールも実行されます.log(a)は参照エラーが発生せず、初期化値undefinedを出力する.実行時に値が割り当てられるため、値が割り当てられ、行に正常にa値が出力されます.

関数式

関数式は、変数に関数を割り当てます.関数式は変数のシースで動作します.変数宣言は実行時までに生成され、変数はundefinedに初期化されます.変数に割り当てられた関数は、実行時に計算されるため、関数式の前に参照または呼び出すことはできません.

関数の加速

関数宣言によって定義された関数は、実行前に関数オブジェクトを最初に作成します.実行時に関数オブジェクトが作成されているため、関数宣言文の前に関数を参照および呼び出すことができます.
関数式と関数宣言、すなわち変数シースと関数シースの違いは、次の例のコードで確認できます.

console.log(add(1,2))//3
console.log(sub(1,2))//undefined

function add(x,y){
  return x+y;
}

const sub = function(x,y){
  return x-y;
}

かくせんたくもんだい

コードを記述すると、予知できない実行結果が発生します.

// 함수 호이스팅으로 변수를 덮어쓴다.
var sum;

console.log(type of sum); //function

function sum(){
  return 1+2;
}; 

// 변수에 할당 값이 있으면 분리 가능
var sum = 10;

console.log (sum()); // sum is not a function

function sum(){
  return 1+2;
};

// 함수 표현식을 사용, const를 사용하여 에러도 표기됨 
console.log(sum); // Cannot access sum before init

const sum=function(){ 
  return 1+2;
};

ハウスティンのトラブルシューティング

var (X) -> let, const (O)

関数を使用して宣言->関数式

[注意]
-講座:クリーンコードJavaScript
-書籍:モダンJavaScript DeepDive