在for循環中聲明的變量范圍，javascript

Question

我在Eclipse中遇到錯誤：

for (var i = 0; i < foo; i++) {
    ...
}
...
while (someCondition) {
    for (var i = 0; i < bar; i++) {
    ...
    }
}

循環使用相同的變量名。 Eclipse給我警告'i' is already defined 。 如果我在第二個for循環中刪除var som，則不會發出警告。

AFAIK在for循環中聲明的變量（在本例中為i ）與循環的作用域相同。

Eclipse是否正確？ 這些i變量是否在同一范圍內？

Answer 1

JavaScript中的局部變量的作用域為封閉函數。 因此，兩個i具有相同的范圍。

為了顯示，

function f() {
  ...
  for (var i = ...; ...; ...) {
    ...
  }
}

相當於

function f() {
  var i;
  ...
  for (i = ...; ...; ...) {
    ...
  }
}

Answer 2

兩個i變量都在同一范圍內，因為JavaScript變量傳統上具有functional scope 。

功能范圍：

功能范圍是指從聲明變量的那一刻開始，變量就在聲明其的函數中為人所知。

功能范圍內的變量是這樣創建的：

var myVariable = "Some text";

功能范圍可以這樣理解：

// i IS NOT known here

function doSomething() {
    // i IS NOT known here
    for (var i = 0; i < bar; i++) {
        // i IS known here
    }
    // i IS known here
}

// i IS NOT known here

---

塊范圍

現在，最新的JavaScript規范還允許使用塊Scope：從聲明變量的那一刻起，就在聲明其的塊內知道變量。

塊范圍變量是這樣創建的：

let myVariable = "Some text";

塊范圍可以這樣理解：

// i IS NOT known here

function doSomething() {
    // i IS NOT known here
    for (let i = 0; i < bar; i++) {
        // i IS known here
    }
    // i IS NOT known here
}

// i IS NOT known here

---

兩個示波器之間的區別

要了解功能范圍和塊范圍之間的區別，請考慮以下代碼：

// i IS NOT known here
// j IS NOT known here

function loop(arr) {
    // i IS NOT known here
    // j IS NOT known here

    for( var i = 0; i < arr.length; i++ ) {
        // i IS known here
        // j IS NOT known here
    };

    // i IS known here
    // j IS NOT known here

    for( let j = 0; j < arr.length; j++ ) {
        // i IS known here
        // j IS known here
    };

    // i IS known here
    // j IS NOT known here
}

// i IS NOT known here
// j IS NOT known here

在這里，我們可以看到我們的變量j僅在第一個for循環中已知，而在之前和之后都不知道。 但是，從定義變量的那一刻起，我們在整個函數中就知道它的變量i 。

---

今天使用塊作用域變量安全嗎？

今天是否可以安全使用，取決於您的環境：

• 如果您正在編寫服務器端JavaScript代碼（ Node.js ），則可以安全地使用let語句。

• 如果您正在編寫客戶端JavaScript代碼並使用轉譯器（例如Traceur ），則可以安全地使用let語句，但是就性能而言，您的代碼可能並非最佳選擇。

• 如果您正在編寫客戶端JavaScript代碼並且不使用翻譯器，則需要考慮瀏覽器支持。

  今天，2016年2月23日，這些瀏覽器不支持let或僅部分支持：

  • Internet Explorer 10及以下（不支持）
  • Firefox 43及更低版本（不支持）
  • Safari 9及更低版本（不支持）
  • Opera Mini 8及以下（不支持）
  • Android瀏覽器4及更低版本（不支持）
  • Opera 36及以下（部分支持）
  • Chome 51及以下（部分支持）

---

如何跟蹤瀏覽器支持

有關在閱讀此答案時哪些瀏覽器支持let語句的最新概述，請參見Can I Use頁面 。