JavaScript 閉包陷阱：迴圈中建立函數陣列，為何全輸出相同值？

問題代碼

function count() {
    var arr = [];
    for (var i = 1; i <= 3; i++) {
        arr.push(function() { return i * i; });
    }
    return arr;
}
var results = count();
console.log(results[0](), results[1](), results[2]()); // 全輸出 16

現象解析

• var i 為**函數作用域**，迴圈結束後 i = 4。
• 陣列中三個函數**共享同一個 `i` 變數** (閉包捕獲變數本身，非值)。
• 呼叫時 i 已為 4，故 4*4=16。

解決方案

方案一：立即調用函數表達式 (IIFE) 建立新作用域

for (var i = 1; i <= 3; i++) {
    arr.push((function(j) {
        return function() { return j * j; };
    })(i));
}

方案二：使用 `let` (ES6) 取代 `var`

for (let i = 1; i <= 3; i++) {
    arr.push(function() { return i * i; });
}
// let 為區塊作用域，每次迴圈建立新綁定

方案三：`bind` 傳入當前值

arr.push(function(j) { return j * j; }.bind(null, i));

關鍵觀念

`var` 函數作用域 + 閉包捕獲變數引用 是經典陷阱。現代開發請直接使用 let/const 避免此類問題。