Зачем использовать локальную область видимости

Ниже приведено решения для обхода ограничения javascript (отсутствие блоковой области видимости).

Рассмотрим общий пример:

Javascript

function wrapElements(a){

    var result = [], i, n;
    for (i = 0, n = a.length; i < n; i++)
    {
        result[i] = function(){
            return a[i];
        }
    }
    return result;

}

var wr = wrapElements([11,12,13,14,15])

var fun = wr[0];

console.log(fun()); // ожидает 11, но получает undefined

Программист ошибочно полагает, что переменная i сохраняет свое значение на момент создания вложенной функции. Однако там содержится ссылка на переменную i, так как замыкания содержат свои внешние переменные в виде ссылок, а не в виде значений.

Значение i увеличивается пока оно не выйдет за пределы количества элементов массива. Далее при вызове функции fun, оно ищет элемент с индексом 5 и возвращает undefined.

Решение: создаем локальную область видимости, путем немедленного вызова функции-выражения.

Javascript

function wrapElements(a){

    var result = [];
    for (i = 0, n = a.length; i < n; i++)
    {

        (function(){
            var j = i;
            result[i] = function(){
                return a[j];
            }
        })()


    }
    return result;

}

var wr = wrapElements([11,12,13,14,15])

var fun = wr[0];

console.log(fun());  //11