JSの変数スコープの詳細な分析-jsチュートリアル-php.cn

JSの変数スコープの詳細な分析

小云云

リリース： 2018-03-08 15:43:30

オリジナル

1302 人が閲覧しました

変数には、グローバル変数とローカル変数の 2 つのスコープがあります。この記事では主に、JS の変数スコープの詳細な分析について説明し、皆様のお役に立てれば幸いです。

グローバル変数

最外层函数定义的变量拥有全局作用域，即对任何内部函数来说，都是可以访问的：
    var n=10;
　　function f1(){
　　　　console.log(n);
　　}
　　f1(); // 输出10,说明全局变量n在函数内部被读取

ログイン後にコピー

ローカル変数

局部变量：在函数内部声明的变量。函数内部的变量，外部无法读取。
　function f1(){
　　　　var n=10;
　　}
　　console.log(n); // 没有定义，说明函数内部的变量，外部无法读取。

ログイン後にコピー

ES5のスコープ

for(var i =0;i<10;i++){

}
console.log(i)

ログイン後にコピー

js、このコードでは何が出力されると思いますか？答えは 10 です。 ES5 ではグローバルスコープと関数スコープのみで、ブロックスコープの機能は実装できません。以下のコードを見てください:

(function(){
for(var i =0;i<10;i++){

}
})()
console.log(i)

ログイン後にコピー

答えは 1 です。この書き方は即時呼び出し関数式 (IIFE) と呼ばれます。これは実際に、このスコープで宣言された変数はブロック内でのみ有効であり、ローカルスコープを作成することはできません。外部からアクセスできます。この書き方の利点は、グローバル変数を汚さないことです。
ここでもう 1 つ言及したいのは、ES5 では変数の宣言が厳密ではないということです。a=10 を直接使用してグローバル変数を宣言できます。以下のように: r

a=10;console.log(a)

ログイン後にコピー

出力 10、ここで変数を使用してそれを使用できます。実際、JS は 1 つのことを行うのに役立ちました。次のコードが実行されます:

var a=undefined;a=10;console.log(a)

ログイン後にコピー

次に、より高度なこと、つまり変数のプロモーションを実行しましょう。 (ES5 の概念、ES6 での新しい使用法では変数の昇格は発生しません)、コードを見てください:

a=10;
(function(){console.log(a)var a=1;
})();

ログイン後にコピー

上記のコードは何を出力しますか?分析してみましょう:

var a=undefined;
a=10;
(function(){var a=undefined;
console.log(a)
a=1;
})();

ログイン後にコピー

これで、変数のプロモーションが何を意味するか理解できました。実際、これは宣言を前面に持ってくることを意味するので、

ES6 のスコープ

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

ログイン後にコピー

出力 a はここでは定義されていません。、let を使用して宣言された変数は、宣言中に使用できません。

a=3let a =10;alert(a)

ログイン後にコピー

は「定義されていません」と出力します。なぜですか? Ruan Yifeng の ES6 では、let コマンドがブロックレベルのスコープに存在する限り、宣言された変数はこの領域に「バインド」され、外部の影響を受けなくなると述べています。 ES6 では、ブロック内に let および const コマンドがある場合、このブロック内でこれらのコマンドによって宣言された変数は最初から閉じられたスコープを形成することを明確に規定しています。宣言前にこれらの変数を使用すると、エラーが発生します。

var a, b;

(function () {
    console.log(a);// undefined
    console.log(b);// undefined

    var a = b = 0;// (1)

    console.log(a);// 0
    console.log(b);// 0
})();

console.log(&#39;window&#39;, a);// window undefined
console.log(&#39;window&#39;, b);// window 0

ログイン後にコピー