スコープとは

変数の有効範囲のこと。変数を取得できる範囲

グローバル変数とローカル変数

グローバル変数はコードのどこからでも取得が可能な変数です。 ローカル変数は有効範囲内でしか取得ができない変数を言います。

var myName = 'taro'; //グローバル変数

var hello = (function (){
    console.log(myName); //グローバル変数は取得可能*1
    var yourName = 'jiro'; //ローカル変数
    return 'Hi ' + yourName + '. my name is ' + myName;
});

console.log(hello()); //'Hi jiro. my name is taro;
console.log(yourName); //ローカル変数は読み込めない*2

上記のコードの場合 myNameがグローバル変数、yourNameがローカル変数です。 関数内で宣言された変数は、その関数内でしか取得ができません。 そのため*2は関数の外側から取得しようとしてるためエラーとなります。

一方関数の中から外の変数を取得することは可能です。 なので*1は変数を取得できます。

グローバル変数の有効範囲をグローバルスコープ ローカル変数の有効範囲をローカルスコープといいます。

変数のvarについて

var myName = 'taro'; //グローバル変数

function hello(){
    yourName = 'jiro'; //varがないとグローバル変数扱いになる
    return 'Hi ' + yourName + '. my name is ' + myName;
};

console.log(hello()); //'Hi jiro. my name is taro;
console.log(yourName); //グローバル変数なので取得可能*3

変数を定義する時に付けるvarですが、なくても変数として扱われます。 ただしこの場合はどこで宣言してもグローバル変数扱いになるため *3は取得できてしまいます。 なので変数を定義する場合はかならずvarを付けます。

関数が入れ子の場合

var global = 'hoge'; //グローバル変数

function func1(){
    //ローカル変数 有効範囲(スコープ)はfunc1内
    var local1 = 'fuga'; 

        function func2(){
                //ローカル変数 有効範囲(スコープ)はfunc2内
        var local2 = 'piyo'; //ローカル変数
        console.log(global)  //'hoge' 内側からは外の変数を取得できる*3
        console.log(local1)  //'fuga' 内側からは外の変数を取得できる*3
        }
        func2();
        console.log(global) //'hoge' global内なので取得できる*4
        console.log(local2) //func1内なので取得できない*4
};
func1();
console.log(local1) //グローバルから関数内は取得できない*5
console.log(local2) //グローバルから関数内は取得できない*5

関数が入れ子になっている場合も基本は同じです func2はfunc1の中に入っています。 この場合func2の中からはglobal、local1を取得できます3 func1の中からはglobalは取得できるが、local2は取得できません4 グローバルからはlocal1、local2は取得できません*5