ホームページ > 記事 > ウェブフロントエンド > JavaScript における変数宣言のホイスティング問題の簡単な分析 (ホイスティング)
1. 変数宣言 hoisting
hoisting English ['hɔɪstɪŋ] US ['hɔɪstɪŋ]
n. 持ち上げる、持ち上げる
v. 持ち上げる、持ち上げる (hoist の現在分詞)
まず、a を見てみましょう。栗
var cc = 'hello'; function foo(){ console.log(cc); var cc = 'world'; console.log(cc); } foo(); console.log(cc);
ここでは、未定義、'world'、'hello' が出力されます
ここには 2 つの主要な知識ポイントがあります:
1. スコープ
2. 変数宣言の改善
JavaScript はインタープリターですコードがインタプリタ (Chrome の V8 エンジンなど) 環境で実行されると、この時点で変数宣言と関数宣言が現在のスコープに昇格されます。この動作は宣言ホイスティング (ホイスティング) と呼ばれます
このコードにはグローバル スコープと関数 foo スコープという 2 つのレベルのスコープがあり、foo の変数宣言は事前解析プロセスにあります。関数スコープの先頭にプロモートされるため、コードは次のようになります:
var cc = 'hello'; function foo(){ var cc; console.log(cc); cc = 'world'; console.log(cc); } foo(); console.log(cc);
最初のログが実行されるとき、変数 cc は宣言されるだけで割り当てられないため、出力されるものは未定義です
2。関数宣言の推進
関数を宣言するには、関数宣言と関数式の 2 つの方法があります
// 函数声明 function foo(a, b) { return a + b; } // 函数表达式 var foo = function(a, b) { return a + b; }
パーサーがデータを実行環境にロードするとき、関数宣言と関数式のスタイルは等しく作成されません。パーサーは、コードを実行する前に、まず関数宣言を読み取り、使用可能 (アクセス可能) にします。関数式については、パーサーがそれが配置されているコード行に到達するまで、実際には解釈され実行されません。
もちろん、var a = function b(){} のように、関数宣言と関数式を同時に使用することもできます。その結果、関数式の効果のみが得られ、b は自動的に実行されます。無視されるため、変数の昇格効果のみが発生します。