사용자에게 많은 자유를 제공하는 기능 지향 언어입니다. 함수를 동적으로 생성하거나 다른 변수에 복사하거나 인수로 다른 함수에 전달하고 나중에 다른 위치에서 호출 할 수 있습니다. JavaScript의 클로저는 함수가 생성 될 때마다 생성됩니다. 이 기사에서는 다음 순서로 클로저에 대해 설명합니다.
JavaScript의 클로저 소개
클로저는 함수 주변 상태, 즉 어휘 환경에 대한 참조와 함께 번들로 제공됩니다. 즉, 클로저는 내부 함수에서 외부 함수 범위로의 액세스를 제공합니다.
자바를 사용하는 경우
대부분의 개발자는 의식적으로 또는 무의식적으로 JavaScript에서 클로저를 사용합니다. 코드를 사용할 때 코드를 더 잘 제어 할 수 있습니다. 또한 가장 자주 묻는 질문입니다. .
예:
function foo () {var x = 10 function inner () {return x} return inner} var get_func_inner = foo () console.log (get_func_inner ()) console.log (get_func_inner ()) console.log (get_func_inner ())산출:
10
10
10
여기에서 액세스 할 수 있습니다. 변하기 쉬운 x는 함수 inner ()를 통해 함수 foo ()에 정의되어 있습니다. 이는 나중에 둘러싸는 함수 실행시 둘러싸는 함수의 범위 체인을 유지하기 때문입니다. 따라서 내부 함수는 범위 체인을 통해 x의 값을 알고 있습니다. 이것이 JavaScript에서 클로저를 사용하는 방법입니다.
실제 폐쇄
클로저를 사용하면 어휘 환경을 해당 데이터에서 작동하는 함수와 연결할 수 있습니다. 이것은 명백한 유사점이 있습니다 객체 지향 프로그래밍 , 여기서 객체를 통해 객체의 속성을 하나 이상의 메서드와 연결할 수 있습니다.
따라서 일반적으로 단일 메서드로만 객체를 사용할 수있는 모든 곳에서 클로저를 사용할 수 있습니다.
자바 코드에서 해시 맵 구현
예:
function makeSizer (size) {return function () {document.body.style.fontSize = size + 'px'}} var size12 = makeSizer (12) var size14 = makeSizer (14) var size16 = makeSizer (16)위의 예는 일반적으로 이벤트에 대한 응답으로 실행되는 단일 함수 인 콜백으로 첨부됩니다.
스코프 체인
JavaScript의 클로저에는 다음과 같은 세 가지 범위가 있습니다.
- 지역 범위
- 외부 기능 범위
- 글로벌 범위
일반적인 실수는 외부 함수 자체가 중첩 함수 인 경우 외부 함수 범위에 대한 액세스에 외부 함수의 포함 범위가 포함되어 효과적으로 함수 범위 체인을 생성한다는 사실을 깨닫지 못하는 것입니다.
// 전역 범위 var x = 10 function sum (a) {return function (b) {return function (c) {// 외부 함수 범위 return function (d) {// 로컬 범위 반환 a + b + c + d + x}}}} console.log (sum (1) (2) (3) (4)) // 로그 20익명 함수없이 작성할 수도 있습니다.
init은 파이썬에서 무엇을합니까?
// 전역 범위 var x = 10 function sum (a) {return function sum2 (b) {return function sum3 (c) {// 외부 함수 범위 return function sum4 (d) {// local scope return a + b + c + d + x}}}} var s = sum (1) var s1 = s (2) var s2 = s1 (3) var s3 = s2 (4) console.log (s3) // log 20위의 예에는 함수의 외부 범위에 액세스 할 수있는 일련의 중첩 함수가 있으므로 클로저가 선언 된 모든 외부 함수 범위에 액세스 할 수 있다고 말할 수 있습니다.
루프 내 폐쇄
JavaScript에서 클로저를 사용하여 모든 인덱스에 익명 함수를 저장할 수 있습니다. 정렬 . 예를 들어 루프 내에서 클로저가 어떻게 사용되는지 살펴 보겠습니다.
예:
function outer () {var arr = [] var i for (i = 0 i<3 i++) { // storing anonymus function arr[i] = function () { return i } } // returning the array. return arr } var get_arr = outer() console.log(get_arr[0]()) console.log(get_arr[1]()) console.log(get_arr[2]())산출:
삼
삼
삼
삼
이것으로 우리는 우리 기사의 끝까지 왔습니다. JavaScript의 클로저가 작동하는 방식과 코드를 더 잘 제어하는 데 사용되는 방식을 이해 하셨기를 바랍니다.
이제 JavaScript의 Closures에 대해 알았으니 에듀 레카. 웹 개발 인증 교육은 HTML5, CSS3, Twitter Bootstrap 3, jQuery 및 Google API를 사용하여 인상적인 웹 사이트를 만들고 Amazon Simple Storage Service (S3)에 배포하는 방법을 배우는 데 도움이됩니다.
질문이 있으십니까? 'JavaScript의 클로저'의 코멘트 섹션에 언급 해 주시면 다시 연락 드리겠습니다.