Javascript變量作用域詳解

Miracle 發布于2019-08-21 14:53 / 1568人閱讀

摘要：變量作用域詳解作用域規則大部分情況下沒有塊級作用域除非你使用當你使用的情況下僅僅支持函數作用域不使用聲明的變量為全局變量不用情況下中局部變量只能通過和函數參數聲明大部分情況下沒有塊級作用域除非你使用與很多語言不同在之前并沒有塊級作用域一個作

Javascript變量作用域詳解 JS作用域規則

JS大部分情況下沒有塊級作用域, 除非你使用let

當你使用var的情況下, JS僅僅支持函數作用域

不使用var, let聲明的變量為全局變量

不用let情況下, JS中局部變量只能通過var和函數參數聲明

1. JS大部分情況下沒有塊級作用域, 除非你使用let

與很多語言不同, JS在ES6之前并沒有塊級作用域:

function test() { // 一個作用域
    for(var i = 0; i < 10; i++) { // 不是一個作用域
        // count
    }
    console.log(i); // 10
    
    for(let j = 0; j < 10; j++) { // 是一個獨立作用域
        // count
    }
    console.log(j); // j is not defined
}

本例中i并不只存在于for循環的區域中而是存在于整個test函數中. 如果我們用let聲明變量i, i則擁有了塊級作用域

2. 在你使用var的情況下, JS僅僅支持函數作用域

剛才講了在ES6之前JS沒有塊級作用域, 那有什么作用域呢? 答案是函數作用域.

function test() {
  var a = "hello"
}
test()
console.log(a) // a is not defined

本例中在函數內部聲明的變量a的作用域僅限于函數內部, 所以在函數外部我們不能訪問到.

3. 不使用var, let聲明的變量為全局變量

如果我們把上面的例子中的var去掉會發生什么呢?

function test() {
  a = "hello"
}
test()
console.log(a) // hello

4. 不用let情況下, JS中局部變量只能通過var和函數參數聲明

由上面的分析我們知道, 函數內部聲明的變量的作用域為函數內也就是屬于局部變量.

//Exp1: 典型錯例
for (var i = 0; i < 10; i++){  
    setTimeout(function(){
        console.log(i);
    }, 1000);
} // 10 10 10...

//Exp2: 利用setTimeout函數傳入參數
for (var i = 0; i < 10; i++){  
    setTimeout(function(i){
        console.log(i);
    }, 1000, i);
} // 1 2 3 4 ...

//Exp3: 利用bind傳入函數參數
for (var i = 0; i < 10; i++){  
    setTimeout(function(i){
        console.log(i);
    }.bind(null, i), 1000);
} // 1 2 3 4 ...

//Exp4: 利用閉包的性質傳入參數
var cb = function(i) {
  return function() {
    console.log(i)
  }
}
for (var i = 0; i < 10; i++){  
    setTimeout(cb(i), 1000);
} // 1 2 3 4 ...

后三個例子看似無關聯其實原理是一致的: 把變量當作函數參數傳入函數, 這樣變量就在函數中有了局部作用域而非全局作用域.
當然, 這其實是JS設計上的缺陷, 在ES6時代我們只需要通過let創建擁有快級作用域的變量就可以輕松解決上述問題了.

//Exp5: 利用let創建塊級作用域參數
for (let i = 0; i < 10; i++){  
    setTimeout(function(){
        console.log(i);
    }, 1000);
} // 1 2 3...

云服務器 GPU云服務器作用域詳解 php變量作用域 javascript作用域鏈變量及數據詳解

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/88059.html

JavaScript的作用域詳解

摘要：而閉包的神奇之處正是可以阻止這件事情的發生。事實上內部作用域依然存在，因此沒有被回收頻繁使用閉包可能導致內存泄漏。拜所聲明的位置所賜，它擁有涵蓋內部作用域的閉包，使得該作用域能夠一直存活，以供在之后任何時間進行引用。作用域作用域（scope），程序設計概念，通常來說，一段程序代碼中所用到的變量并不總是有效/可用的，而限定這個變量的可用性的代碼范圍就是這個變量的作用域。通俗一點就是我...

cnio 2019-08-23 12:08 評論0 收藏0
ES6 變量作用域與提升：變量的生命周期詳解

摘要：不同的是函數體并不會再被提升至函數作用域頭部，而僅會被提升到塊級作用域頭部避免全局變量在計算機編程中，全局變量指的是在所有作用域中都能訪問的變量。 ES6 變量作用域與提升：變量的生命周期詳解從屬于筆者的現代 JavaScript 開發：語法基礎與實踐技巧系列文章。本文詳細討論了 JavaScript 中作用域、執行上下文、不同作用域下變量提升與函數提升的表現、頂層對象以及如何避免創建...

lmxdawn 2019-08-21 11:55 評論0 收藏0
詳解js變量、作用域及內存

摘要：不是引用類型，無法輸出簡而言之，堆內存存放引用值，棧內存存放固定類型值。變量的查詢在變量的查詢中，訪問局部變量要比全局變量來得快，因此不需要向上搜索作用域鏈。贊助我以寫出更好的文章，give me a cup of coffee? 2017最新最全前端面試題基本類型值有：undefined，NUll，Boolean，Number和String，這些類型分別在內存中占有固定的大小空...

waltr 2019-08-21 10:19 評論0 收藏0
閉包詳解一

摘要：再看一段代碼這樣就清晰地展示了閉包的詞法作用域能訪問的作用域將當做一個值返回執行后，將的引用賦值給執行，輸出了變量我們知道通過引用的關系，就是函數本身。在正式學習閉包之前，請各位同學一定要確保自己對詞法作用域已經非常的熟悉了，如果對詞法作用域還不夠熟悉的話，可以先看：深入理解閉包之前置知識---作用域與詞法作用域前言現在去面試前端開發的崗位，如果你的面試官也是個前端，并且不是太...

cnio 2019-08-22 17:32 評論0 收藏0
閉包全面詳解

摘要：環境由閉包創建時在作用域中的任何局部變量組成。嚴格來說，閉包需要滿足三個條件訪問所在作用域函數嵌套在所在作用域外被調用閉包的形成原理先了解的垃圾回收機制會找出不再使用的變量，不再使用意味著這個變量生命周期的結束。什么是閉包最原始定義閉包(closure)，是指函數變量可以保存在函數作用域內，因此看起來是函數將變量包裹了起來。 //根據定義，包含變量的函數就是閉包 function...

qylost 2019-08-26 10:38 評論0 收藏0