スコープについて【JavaScript】

JavaScript

 

今回は、JavaScriptプログラミングでよく聞く「スコープ」について。

簡単にまとめました。

スコープとは?

スコープとは、関数や変数が使える有効範囲のことです。

関数や変数はどこまでもアクセスできる訳ではなく、使える範囲が決まっているのです。

なぜスコープが必要なのか?

スコープがあることによって、関数や変数の有効範囲以外への影響を防ぐことが出来ます。

有効範囲が決まっていることで、コードの修正がしやすかったり、エラーチェックもやりやすくなります。

スコープの種類

スコープは2種類あります。

サンプルプログラムを見ながら見ていきましょう。

グローバルスコープ

グローバルスコープとは、どこからでもアクセスできて有効なスコープのことです。

以下のコードを見ましょう。

var name1 = "グローバルスコープです";

        function test() {
            var name2 = "関数のスコープです";
            if(true) {
                let name3 = "ブロックスコープです";
            }
        }
        
        console.log(name1);
        // →グローバルスコープです

 

上記の「name1」の変数は、どこからでもアクセスできるグローバルスコープです。

そして、試しにconsoleで表示してみると、「グローバルスコープです」としっかり表示されます。

ローカルスコープ

ローカルスコープとは、グローバルスコープ以外のスコープのことです。

そしてローカルスコープはさらに、関数スコープとブロックスコープに分けられます。

関数スコープとは、関数(function)ごとに作られるスコープ。

ブロックスコープは、ブロック({})ごとに作られるスコープのこと。

 

それでは以下のコードを見てみましょう。

var name1 = "グローバルスコープです";

        function test() {
            var name2 = "関数のスコープです";
            if(true) {
                let name3 = "ブロックスコープです";
            }
        }
        
        console.log(name2);
        // →エラーになる
        console.log(name3);
         // →エラーになる

 

まずname2は関数の中で宣言されている変数になるので、関数の外でconsoleを表示してもエラーになります。

そして、name3もブロック({})の中で宣言されている変数になるので、こちらも関数の外でconsoleを表示してもエラになります。

コードを見ると、「グローバルスコープ」と「ローカルスコープ」の違いが分かるでしょう。

まとめ

以上が、スコープについてでした。

JavaScriptのプログラミングをする際に必ず必要な知識になってくるので、是非理解しておきましょう。