Введение

Из этой статьи Вы узнаете о замыкании в JavaScript.

 

Замыкание в JavaScript


 

JavaScript работает в лексической области видимости. Рассмотрим следующий пример кода, чтобы понять данное утверждение.

 

function myapp() {

    var name = "foo";

    function greet() {

        console.log("hello " + name);

    }

    greet();

}

myapp();

 

Как видите, «greet» – внутренняя функция функции «myapp», имеющая доступ к локальной переменной внешней функции. При запуске кода, рассмотренного выше, строка «hello foo» будет отображена в консоли из-за лексической области видимости функции. В JavaScript область действия переменной либо глобальная, либо в рамках функции, в которой она объявлена. Каждая переменная поднимается наверх.

Давайте рассмотрим другой код, слегка измененную версию предыдущего примера. Здесь мы возвращаем функцию «greet» из функции «myapp». Только запомните, что функция «greet» – внутренняя функция, тогда как «myapp» – внешняя.

 

function myapp() {

    var name = "foo";

    function greet() {

        console.log("hello " + name);

    }

    return greet;

}

var result = myapp();

result();

 

В результате выполнения данного кода строка «hello foo» будет также напечатана в консоли.

Давайте рассмотрим, почему так происходит. Может показаться, что когда выполняется функция myapp(), локальная переменная внутри функции «myapp» не должна быть доступна для использования. Таким образом, ожидаемый результат – строка «hello undefined». Однако, мы все ещё можем использовать локальную переменную в функции, возвращаемой из функции, в которой локальная переменная была определена. Это явление называется «замыкание». Предыдущий код – фрагмент результата замыкания в JavaScript.

 

Замыкание

 

В предыдущем примере кода присутствовало замыкание, имеющее информацию о функции и ее среде, где оно было создано. В этом случае окружение – локальная переменная. Таким образом, рассмотренное замыкание имело информацию о функции «greet» и об имени переменной. Давайте рассмотрим ещё один пример для лучшего понимания замыкания.

 

function app(name) {

    function greet(message) {

        return message + " " + name;

    }

    return greet;

}

var a = app("dj");

var result1 = a("hello");

console.log(result1);

 

var b = app("mahesh");

var result2 = b("whats'up");

console.log(result2);

 

В данном примере кода a и b – замыкания в JavaScript. У них есть информация о функции «greet», окружении названия и сообщении переменной. Как результат, Вы увидите строку «hello dj» и «whats’p mahesh».

Источник: http://www.c-sharpcorner.com/UploadFile/dhananjaycoder/what-is-closure-in-javascript/