В этой статье я пройду следующую
- Функции и облагания
- Что замыкают в JavaScript
- Как обрабатываются закрытия в памяти
- Почему это названо
закрытие
Функции
Функция аналогична процедуре или набору операторов, которые используются для выполнения определенной задачи. Для процедуры квалификации в качестве функции он должен предпринять некоторую вход, выполнять различные действия на эти данные и возвращать результат.
Вообще говоря, существует несколько способов определить функции
- Декларация функции
- Функция выражения
- Стрелка синтаксис
// Function daclaration - Uses the function keyword
function myFunc() = {};
// Function expression - the name can be omitted, giving an anonymous function
var a = function() {}; // name omitted
var b = function myFuncTwo() {}; //function name included
// Arrow functions - arrow function syntax is a shorter syntax for a function expression
const c = () => {};
Охватывает
Область применения является политикой, которая управляет доступностью переменных. Переменная, определенная внутри прицела, доступна только в пределах этой области, но недоступна снаружи.
Область применения, где находится переменная, решает, если оно доступно или недоступно из определенных частей программы.
Есть два типа областей
- Глобальный объем
- Блок или локальный объем
// Global scopes are variables that are accessible from any part of the program
var e = 2 // variable declared in the global scope
const square = () => {
return e * e
}
console.log(square()) // outputs 4
// Block/local scope refers to variables declared within a block '{}'
var f = 5 // variable declared in the global scope
const times = () => {
let g = 5 // variable declared in the block/local scope
return f * g
}
console.log(times()) // Outputs 25
console.log(g) // outputs undefined, because it was defined within the times function.
Закрытие
Закрытие – Функция, которая представляет собой объект первого класса, который имеет доступ к переменным, определенным в том же локальном объеме, в котором он был определен.
Другими словами, закрытие дает вам доступ к объему внешней функции из внутренней функции.
Давайте посмотрим на закрытие с тремя примерами
// 1
function extFunc() {
// Define a variable local to extFunc
const extVar = "I used a closure"
function intFunc() {
// We can access the variable defined in the scope of extFunc within inFunc
console.log(extVar)
}
// Return the inner function. Note that we're not calling it here!
return intFunc
}
// Call the outer function, which returns the inner function
const closure = extFunc()
// Call the returned function that we stored as a variable
closure()
// outputs 'I used a closure'
// 2
const seconds = 60
const text = "minutes is equal to"
function timeConversion() {
let minutes = 2
return function minutesToSeconds() {
const minToSec = `${minutes} ${text} ${seconds * minutes} seconds`
return minToSec
}
}
const convert = timeConversion()
console.log(convert()) // outputs "2 minutes is equal to 120 seconds"
console.log(timeConversion()()) // outputs "2 minutes is equal to 120 seconds"
// 3
function scores() {
var score = 85
function displayScore() {
alert(score);
}
displayScore();
}
const showScore = scores();
showScore();
В примере 1 ExtFunc () Создает локальную переменную под названием Extvar и функция называется Intfunc () Отказ Intfunc () Функция – это внутренняя функция, определяемая внутри ExtFunc () и доступен только в теле ExtFunc () функция. Обратите внимание, что Intfunc () Функция не имеет местных переменных самостоятельно. Однако, поскольку внутренние функции имеют доступ к переменным внешних функций, Intfunc () может получить доступ к имени переменной, объявленном в родительской функции, ExtFunc () Отказ
В примере 2 Вернуть Intfunc линия в 1 можно избежать, возвращая внутреннюю функцию во время объявления.
В примере 3 в 3 Внутренняя функция не возвращается (вызывается только) из-за команды оповещения в его блоке.
// switching the code in 3 from alert to console.log
function scores() {
var score = 85;
function displayScore() {
console.log(score);
}
displayScore();
}
const showScore = scores();
showScore(); // outputs 85 to the console
// get TypeError showScore is not a function
На первый взгляд, это может показаться неприятным, что этот код все еще работает. На некоторых языках программирования локальные переменные в рамках функции существуют только для выполнения этой функции. Однажды баллы () Отделка выполнения, вы можете ожидать, что переменная имени больше не будет доступна. Однако, поскольку код все еще работает, как ожидалось, это, очевидно, не так в JavaScript.
Причина в том, что функции в замыканиях формы JavaScript. Закрытие – это сочетание функции и лексической среды, в пределах которой была объявлена эта функция. Эта среда состоит из любых местных переменных, которые были введены в область примерно на момент закрытия. В этом случае Showncore это ссылка на экземпляр функции Displyscore это создано, когда баллы () бежит. Экземпляр Displyscore поддерживает ссылку на ее лексическую среду, в рамках которой существует имя переменной. По этой причине, когда Showncore вызывается, переменная Оценка Останки доступны для использования, а «85» передается на консоль, а затем типError.
Когда внутренняя функция создана, JavaScript Engine обнаруживает, что для выполнения функции в будущем будет необходима ссылка на переменную, объявленную во внешней функции.
Чтобы решить это, двигатель хранит ссылку на эту переменную для более позднего использования, а также хранит ссылку в специальной функции Scoped Contection Context.
Такая функция с «памятью» об окружающей среде, где она была создана, просто известна как: закрытие Отказ
Как обрабатываются закрытия в памяти
Когда вызывается чистая функция, которая зависит от собственных аргументов и данных, ее подтолкнутся к ** Вызов стека ** Где оно выполняется, и ИТ-данные хранятся в памяти, пока оно не будет удалено.
Но когда функция ссылается на данные вне собственного объема, то есть из его лексической среды или внешней функции, для переводчика, чтобы вызвать эту функцию или знать значение этой бесплатной переменные, оно создает закрытие Чтобы хранить их на месте в память, где их можно получить доступ позже. Эта область в памяти называется ** Куча памяти * * .
Теперь в отличие от Стек вызовов который недолговечен, Куча памяти Может хранить данные на неопределенный срок и решить, когда он будет готов быть отброшенным.
Закрытия требуют большего количества энергии памяти и обработки, чем обычные функции, но имеет много важных практических применений, например, Инкапсуляция данных Отказ
Инкапсуляция данных – это просто способ защиты данных, чтобы предотвратить его утечку, где он не нужен.
Почему имени закрывают тогда?
Это связано с тем, что внутренняя функция проверяет ее окружающую среду и закрывает переменные в лексической области, в которой она определяется, и что его необходимо запоминать для будущего использования. Ссылки на переменные замкнуты в специальной структуре данных, которые могут быть доступны только к самому времени выполнения JavaScript.
Оригинал: “https://dev.to/tonyedgal/closures-a-comprehensive-guide-to-closures-functions-and-scopes-aga”