ホームページ  >  記事  >  ウェブフロントエンド  >  JavaScript における変数宣言のホイスティング問題の簡単な分析 (ホイスティング)

JavaScript における変数宣言のホイスティング問題の簡単な分析 (ホイスティング)

高洛峰
高洛峰オリジナル
2016-12-03 13:45:331229ブラウズ

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 は自動的に実行されます。無視されるため、変数の昇格効果のみが発生します。


声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。