찾다
웹 프론트엔드JS 튜토리얼Javascript 중첩 함수 및 closures_javascript 기술에 대한 간략한 토론

【중첩 함수】
JavaScript는 내장 함수를 허용하고, 함수를 데이터로 사용할 수 있도록 하며, 함수 어휘 범위 내에서 기존 객체 지향 언어와 놀라운 차이를 만들어낼 수 있습니다.
우선 JavaScript 함수는 동적으로 범위가 지정되지 않고 어휘적으로 범위가 지정됩니다. 따라서 함수는 실행되는 범위가 아닌 정의된 범위에서 실행되므로 중첩된 경우를 이해하기 쉽습니다. 함수와 그 주변 함수는 동일한 어휘 범위에서 정의됩니다. 예를 들어 다음과 같은 매우 평범한 코드는 다음과 같습니다.
코드 복사 코드는 다음과 같습니다.

var x = 'global';
function f () {
var x = 'local';
function g() {
alert(x); ();
}
f(); // 'local'


f()가 호출되면 호출을 포함하여 두 부분으로 구성된 것으로 이해될 수 있습니다. f 객체의 다음 전역 객체가 옵니다. 이때, x의 값을 검색할 때에는 f의 호출 객체부터 먼저 검색하게 되며, 찾지 못하면 후속 전역 객체에서 x를 검색하게 된다. 마찬가지로 g는 f의 중첩 함수이므로 g가 호출될 때 범위 체인은 g의 호출 개체, f의 호출 개체, 전역 개체의 세 부분으로 구성되어야 합니다. 함수 g는 x 값을 출력하므로 먼저 g의 호출 개체에서 x 값을 검색합니다. 그런 다음 주변 f 호출 개체에서 x의 정의를 검색합니다. x='local'을 찾으면 전역 개체를 계속 검색하는 대신 x를 출력합니다. x 값이 f에 정의되어 있지 않으면 범위 체인 뒤에 있는 전역 개체를 계속 검색하고 결과는 전역이 됩니다. 전역 객체에 정의되어 있지 않으면 당연히 정의되지 않습니다.
알겠습니다. 동시에 우리는 클로저에 두 가지 일반적인 용도가 있다는 것을 알고 있습니다. 하나는 로컬 변수에 액세스하는 데 사용할 수 있다는 것이고, 다른 하나는 사용할 수 있다는 것입니다. 주변적으로는 해당 필드의 변수 값이 메모리에 저장되며 함수 호출이 완료된 후에도 소멸되지 않습니다.
다음으로 클로저가 외부 변수 값을 메모리에 저장할 수 있는 이유를 이해하는 데 도움이 될 수 있는 평범한 예를 살펴보겠습니다.


function makeFunc (x) {
return function ( ) {return x }
}
var a = [makeFunc(0), makeFunc(1), makeFunc(2)]
alert(a[0]()); >alert( a[1]());
alert(a[2]());


실행 결과는 0,1,2 입니다. 또한 어휘 범위의 엄격한 일반 동작입니다. 각 makeFunc 호출이 완료된 후 해당 호출 개체는 범위 체인에서 제거되고 더 이상 이에 대한 참조가 없으며 결국 가비지 수집을 통해 완료됩니다. 좀 더 자세히 말하자면 이렇게 이해할 수 있습니다.
makeFunc가 호출될 때마다 호출 개체가 생성되어 범위 체인에 배치됩니다. makeFunc 함수의 경우 호출 개체에는 속성이 포함되어 있습니다. 함수가 실행되면 호출 개체가 생성되어 범위 체인에 배치됩니다. 익명 함수의 호출 객체이므로 주변 함수를 참조합니다. makeFunc의 호출 객체(액세스) 호출 객체에 x가 포함되어 있으므로 x도 소멸될 때 소멸됩니다. 저장되지 않습니다.
위는 함수의 상세한 실행 과정이므로 잘 이해하시고 아래의 변경된 코드를 살펴보시기 바랍니다.



코드 복사 코드는 다음과 같습니다: var x = 0;
function makeFunc () {
return function () {return x }
}
var a = [ makeFunc(), makeFunc(), makeFunc()];
alert(a[0]())
alert(a[1]()); );


이제 x는 전역 변수이고 실행 결과는 0, 1, 2이지만 이 결과는 위와 다소 다릅니다. 다음으로, 이러한 결과가 나온 이유를 스코프 체인의 관점에서 이해하겠습니다.
마찬가지로 makeFunc가 호출될 때마다 내부 중첩 함수에 대한 참조를 반환하므로 호출 개체를 범위 체인에 생성하므로 내부 중첩 함수가 실행되기 시작하고 중첩 함수에 대한 호출 개체가 생성됩니다. 범위 체인. 그런 다음 x 값을 반환합니다. 여기서는 중첩된 함수의 호출 개체에 x가 없고 주변 makeFunc의 호출 개체에도 x가 없습니다. 전역 객체에서 x의 정의를 찾았으므로 정상적으로 실행되고, x의 값이 반환되고, x가 1씩 증가한 다음 중첩 함수가 완료되고, 호출 객체가 제거되고, makeFunc가 완료됩니다. 호출 객체도 제거되지만 호출 객체에 x가 없기 때문에 호출 객체가 소멸되더라도 x에는 전혀 영향을 미치지 않습니다. 결과적으로 전역 변수 x 값의 변경 사항이 저장됩니다.
위에서 언급한 외부 호출 개체에 대한 액세스는 이해를 돕기 위한 것일 뿐 엄격하지 않습니다. 그러나 JavaScript는 호출 개체에 직접 액세스하지 않습니다. 그러나 정의하는 속성은 범위 체인의 일부입니다. 호출 개체는 여전히 "살아있습니다". 또한 주변 함수에 모두 전역 개체에 대한 참조가 있는 두 개 이상의 중첩 함수가 포함된 경우 이러한 중첩 함수는 모두 동일한 전역 호출 개체를 공유하며 그 중 하나에 의한 전역 개체에 대한 변경 사항이 다른 함수에 표시됩니다. 의.
자바스크립트에서 함수는 실행될 코드와 이러한 코드가 실행되는 범위로 구성된 복합체입니다. 광범위하게 말하면 이러한 코드와 범위의 복합체를 클로저라고 부를 수 있습니다.
 【Closure】
가끔 변수의 값을 기억하기 위해 호출해야 하는 함수를 작성해야 할 때가 있습니다. 따라서 범위를 이해하면 호출 후에 함수의 호출 개체를 유지할 수 없기 때문에 지역 변수를 달성하기 어렵다는 것을 알 수 있습니다. 위의 예에서처럼 전역 변수가 이를 수행할 수 있지만 이로 인해 전역 변수 오염이 쉽게 발생할 수 있습니다. 호출 객체를 유지할 수 없으니 그냥 호출 객체에 값을 저장하면 안되는 걸까요? ! 따라서 이를 수행하는 한 가지 방법은 다음과 같습니다. 함수 개체 자체의 속성을 사용하여 저장하는 것입니다.
코드 복사 코드는 다음과 같습니다.

uniqueID = function() {
if (!args.callee.id)args.callee.id = 0;
returnargs.callee.id
}
alert(uniqueID()) //0
alert(uniqueID) ()) ; //1

위와 같이 함수 자체가 객체이기 때문에 함수 자체의 속성 중 하나로 저장하는 것이 가능하지만, 여기에는 문제가 있습니다. 즉, 누구나 언제든지 저장할 수 있습니다. unqueID.id를 통해 원래 저장한 값에 강제로 액세스하여 수정할 수 있습니다. 이것이 우리가 보고 싶지 않은 것입니다.
그래서 일반적으로 우리는 이를 달성하기 위해 클로저를 사용합니다.
코드 복사 코드는 다음과 같습니다.

_uniqueID = (function() {
var id = 0;
return 함수 () {return id }
})()
alert(_uniqueID()) //0
alert(_uniqueID()) ; //1

마찬가지로 결과를 설명하기 위해 use 도메인을 사용합니다. _uniqueID 자체는 익명 함수이고 그 안에 익명 중첩 함수가 있다는 점에 유의하세요. 우리가 직접 호출하는 것은 _uniqueID()입니다. 즉, 우리가 직접 호출하는 것은 실제로 _uniqueID 내부에 중첩된 함수이며 호출 개체입니다. 자체적으로는 ID를 정의하지 않으므로 주변 호출 객체의 ID를 참조하고 이를 반환합니다. ID는 1씩 증가합니다. 실행이 완료되면 내부 중첩 함수 호출 객체가 범위 체인 밖으로 이동합니다. 주변기기 ID는 파기되지 않아서 이렇게 저장되었습니다.
헷갈리시는 분들도 계시겠지만, 함수가 실행된 후 호출 객체가 스코프 체인을 제거했다고 하지 않나요? 주변 익명 함수(function(){})()도 호출되었기 때문에 호출 개체에는 없어야 합니다. 맞습니다.
예, 호출 개체는 현재 함수가 실행된 후 참조를 종료하지만 위의 _uniqueID() 호출을 오해하지 마십시오. 직접 호출되는 주변 함수가 아니라 호출된 중첩 함수입니다. 함수 세트에는 주변 함수의 범위 체인이 포함됩니다. 따라서 호출 개체가 범위 체인을 제거하면 이 범위 체인에 있는 다른 개체의 속성에 액세스하고 변경할 수 있습니다.
클로저 자체는 이해하기 어렵지만 도움이 필요한 분들에게 도움이 되었으면 좋겠습니다. 또한, 제한된 자격으로 인해 제가 이해한 내용이 틀릴 수도 있습니다. 발견 시 정정해 주시기 바랍니다.
성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
一文浅析Golang中的闭包一文浅析Golang中的闭包Nov 21, 2022 pm 08:36 PM

闭包(closure)是一个函数以及其捆绑的周边环境状态(lexical environment,词法环境)的引用的组合。 换而言之,闭包让开发者可以从内部函数访问外部函数的作用域。 闭包会随着函数的创建而被同时创建。

python闭包有哪些python闭包有哪些Oct 30, 2023 pm 04:53 PM

python闭包主要包括函数闭包和装饰器闭包。详细介绍:1、函数闭包是指在一个函数内部返回另一个函数,并且返回的函数能够访问到其内部变量。这样的返回函数就是函数闭包,函数闭包在程序中可以被反复使用,因此可以用来实现一些功能上的封装;2、装饰器闭包是指在使用装饰器时,被装饰的函数并没有直接被调用,而是被包装在一个函数内部,并返回一个新的函数。这个新的函数就是一个装饰器闭包等等。

如何利用PHP7的匿名函数和闭包实现更加灵活的代码逻辑处理?如何利用PHP7的匿名函数和闭包实现更加灵活的代码逻辑处理?Oct 21, 2023 am 10:21 AM

如何利用PHP7的匿名函数和闭包实现更加灵活的代码逻辑处理?在PHP7之前,我们经常使用函数来封装一段特定的逻辑,然后在代码中调用这些函数来实现特定的功能。然而,有时候我们可能需要在代码中定义一些临时的逻辑块,这些逻辑块没有必要创建一个独立的函数,同时又不想在代码中引入太多的全局变量。PHP7引入了匿名函数和闭包,可以很好地解决这个问题。匿名函数是一种没有名

Python中的闭包是如何实现的?Python中的闭包是如何实现的?Oct 21, 2023 am 10:33 AM

Python中的闭包是如何实现的?闭包是一种函数内部定义的函数,并且在函数内部引用了外部函数的变量。这种特性使得内部函数可以访问外部函数的变量,并且在外部函数执行完毕后,闭包仍然可以访问和操作外部函数的变量。闭包在Python中通过以下几个步骤来实现:定义外部函数,并在其中定义内部函数:首先,我们需要在外部函数内部定义一个内部函数。这个内部函数即是闭包。de

react有哪些闭包react有哪些闭包Oct 27, 2023 pm 03:11 PM

react有事件处理函数、useEffect和useCallback、高阶组件等等闭包。详细介绍:1、事件处理函数闭包:在React中,当我们在组件中定义一个事件处理函数时,该函数会形成一个闭包,可以访问组件作用域内的状态和属性。这样可以在事件处理函数中使用组件的状态和属性,实现交互逻辑;2、useEffect和useCallback中的闭包等等。

怎么样减少闭包的产生怎么样减少闭包的产生Oct 27, 2023 pm 04:28 PM

减少闭包产生的方法有避免不必要的闭包、控制闭包的返回值、使用弱引用、减少不必要的全局变量、合理使用循环和递归、使用事件代理、编写单元测试、遵循设计原则和使用工具进行代码分析等。详细介绍:1、避免不必要的闭包,在很多情况下,闭包并非必需的,可以用模块模式来实现私有变量,避免使用闭包;2、控制闭包的返回值,在使用闭包时,应该尽量控制闭包的返回值,如果闭包返回的是基本数据类型等等。

如何使用PHP7的匿名函数和闭包实现更加灵活和可复用的代码逻辑?如何使用PHP7的匿名函数和闭包实现更加灵活和可复用的代码逻辑?Oct 24, 2023 am 10:30 AM

如何使用PHP7的匿名函数和闭包实现更加灵活和可复用的代码逻辑?在PHP编程领域中,匿名函数和闭包是非常有价值和强大的工具。PHP7引入了一些新的语言特性,使得使用匿名函数和闭包更加方便和灵活。本文将介绍如何使用PHP7的匿名函数和闭包来实现更加灵活和可复用的代码逻辑,并提供一些具体的代码示例。一、匿名函数匿名函数是一种没有名称的函数。在PHP中,可以将匿名

如何解决Python的闭包错误?如何解决Python的闭包错误?Jun 24, 2023 pm 11:23 PM

Python是一种非常流行的编程语言,因为它非常易学易用,同时也具备了强大的功能。其中,闭包是Python中的一种函数,它可以在函数的内部定义另一个函数,并返回这个函数作为函数的返回值。尽管闭包非常方便,但有时会出现某些错误,比如闭包错误。本文将介绍如何解决Python的闭包错误。初步了解闭包在Python中,闭包是由一个内部函数和一个定义在内部函数之外的函

See all articles

핫 AI 도구

Undresser.AI Undress

Undresser.AI Undress

사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

Clothoff.io

AI 옷 제거제

AI Hentai Generator

AI Hentai Generator

AI Hentai를 무료로 생성하십시오.

뜨거운 도구

스튜디오 13.0.1 보내기

스튜디오 13.0.1 보내기

강력한 PHP 통합 개발 환경

SublimeText3 중국어 버전

SublimeText3 중국어 버전

중국어 버전, 사용하기 매우 쉽습니다.

SublimeText3 Linux 새 버전

SublimeText3 Linux 새 버전

SublimeText3 Linux 최신 버전

메모장++7.3.1

메모장++7.3.1

사용하기 쉬운 무료 코드 편집기

드림위버 CS6

드림위버 CS6

시각적 웹 개발 도구