理解JavaScript做用域

1.什麼是做用域？

做用域是指定義變量的區域。

2.做用域有什麼做用？

做用域規定了如何查找變量，也就說當前代碼對變量的查找權限。

3.JS中有幾種做用域？

1.全局做用域
全局做用域是最外圍的一個環境，能夠在代碼中任何地方訪問到。在瀏覽器中全局做用域就是window，所以在全局中聲明的變量和方法就是window的屬性和方法。

接下來咱們看個🌰

var name = "global";
var num = 100;
function test() {
    var inner_name = "test";
    g_name = "global too";
    console.log(name); //global
    console.log(num); //100
}
console.log(inner_name); //inner_name is not defined
console.log(g_name); //global too
test();

從上面的例子中，咱們能看出全局聲明的變量在哪裏均可以訪問到，咱們在test函數中建立了一個局部變量inner_name，想在外部訪問它，可是結果報出一個沒有聲明的錯誤，因而可知外部環境不能訪問內部環境的變量和函數。在函數test中有一個變量g_name，它沒有用var進行聲明，而且它能夠在函數外部進行訪問，這個變量擁有全局做用域，不聲明就直接給變量賦值是一種錯誤的作法，應該避免。

2.局部做用域
在局部做用域中，局部做用域與全局正好相反，局部做用域只能訪問在固定的代碼片斷中訪問到。局部做用域也就是函數做用域。

3.塊做用域
在ES5中，是沒有塊級做用域這個概念的，舉個例子：

for(var i=0;i<5;i++) {
    ....
}
console.log(i); //5

由上述例子可見，JS不一樣於Java和C++的地方是沒有塊級做用域，在大括號以後依舊能夠訪問變量。爲了解決這個問題，ES6引入了let、const兩種聲明的方法。這兩種聲明方法能夠將{}變爲塊級做用域，看個例子。

//let
for(let i=0;i<5;i++) {} 
console.log(i); //i is not defined
//const
{
    const name = "const";
    console.log(name); //const
}
console.log(name);//name is not defined

4.動態做用域和靜態做用域

JS採用的是靜態做用域，不是動態做用域。舉個例子來講明一下，看下面代碼。

var i = 10;
function test() {
    console.log(i); //10
}
function foo() {
    var i = 20;
    test();
}
test();

靜態做用域是在函數聲明時決定的，動態做用域是在函數調用決定的。
——咱們能夠假設一下，JS採用的是動態做用域，在test函數執行時，首先在test的函數中找i這個變量，沒有找到因而去上一級做用域中查找，在foo函數中找到i這個變量，輸出i應該獲得20，可是獲得的值是10。
——咱們再假設，JS採用的是靜態做用域，在test函數執行時，在test函數中沒有找到i這個變量因而去上一級做用域中查找，由於test是在全局做用域中聲明的，因此上一級做用域也就是全局做用域。在全局變量找到了i這個變量，輸出i的值是10。

以上就是對JS做用域的基本理解，若有錯誤與缺失，請指正，謝謝。

參考連接：

• https://github.com/mqyqingfen...
• https://segmentfault.com/a/11...