上一篇文章有提到關於Scope chain的部分，今天整理完就來介紹一下吧

Scope(範圍、範疇)

這邊先把這兩個名詞Scope跟Chain分開，在JS的世界裡Scope有點類似變數可以被看到或作用的範圍。

怎麼聽起來有點像咒術戰裡的領域展開

有分為全域變數跟區域變數

全域變數

變數若未在Function或是Block中宣告的變數，這樣變數就是一個全域物件。

let str1 = '我是帥哥'

Fuction callMehandsome (){
    console.log(str1);
}

callMehandsome(); //印出我是帥哥

可以在任何一個地方使用這個變數，因為它是一個全域變數。
所以記得要使用變數之前一定要記得宣告，不然就會成為全域物件會造成全域污染

區域變數

變數若在Function或是Block中宣告的變數，這樣變數就會是一個區域變數。

區域變數又可以切分成兩個作用區域Funticon Scope 跟 Block Scope。

function Scope

JS中var的範圍設定就是function Scope，所以今天用var宣告變數：

function addNumber(){
    var a = 2;
    var b = 3;
    console.log(a + b);
}

addNumber();

簡單一點來說，a跟b這兩個變數在Function中被宣告後會成為區域變數，離開這個Function後可以再重新宣告。
因為a跟b會被關在Function中，離開這個Function後就不會存在。

那假設如果我今天沒有在function內宣告呢？ 那就會往外層去找是否有宣告變數！

var a = 1

function printA (){
    console.log(a)
}

printA();

你一定也想問如果外層也沒有呢？ 那就會往window去找！

所以才會一直強調為什麼變數要使用前一定要宣告

Block Scope

那在ES6後出現let跟const之後的範圍設定又有點不太一樣，是Block Scope。

funticon跟block兩者之間的差異在於block是用{ }大括弧(curly brace)來定義區域，而funtiocn是用funtcion(){ }。

{ const age = 18
    console.log(age);
}

簡單來說在一個{ }用let或是const宣告變數，離開這個大括弧以後這個變數也就不存在了。

Scope Chain

這邊就不囉唆，直接上程式碼伺候

var age = 18; 

function a (){
    var age = 38; 
    b();
}

function b (){
    console.log(age);
}

b(); //這邊出來的結果是18

為什麼會是這個結果呢？

明明函式a有重新宣告age的值跟呼叫函式b？又或是函式b也沒有宣告age這個變數啊，應該也是 undefinded。

其實js已經替function b 建立了他的函式執行環境，而在建立執行環境的時候，也替他建立了 this 和 外部環境參考（Reference to Outer Environment）。
對 function b 來說，他自己沒有 age 這個變數，所以他往外部參考環境找，而他的外部環境是全域，不是 function a。所以 function b 取得的是全域變數 age = 18。
而 function b 這個往外找的這個行為，就是所謂的範圍鏈 (Scope Chain)。

因為程式總不能動不動就噴錯吧

參考文章
[JavaScript] Javascript 的作用域 (Scope) 與範圍鏈 (Scope Chain)：往外找