닫다뭐가 끝이야?

7569 단어
오늘 우리는 자바스크립트의 클로즈업에 대해 토론할 것이다.나는 클로즈업에 관한 블로그와 글이 많다는 것을 알고 있지만, 사람들은 이 화제를 이해하기 어렵다고 생각하는 것 같다.나는 자신의 방식으로 클립을 해석해 보려고 하는데, 나는 이것이 매우 이해하기 쉽다고 생각한다.이것도 너희들에게 도움이 되었으면 좋겠다.클로즈업에 대해 깊이 있게 연구하기 전에 다음과 같은 주제를 이해하도록 하겠습니다. (이점을 이해하면 클로즈업을 더욱 잘 이해할 수 있습니다)
  • 기능 범위
  • 1급 함수

  • 기능 범위
    Javascript에서는 함수를 만들 때마다 역할 영역이 만들어집니다.전체 함수에서 접근 범위 내에서 설명할 수 있는 변수입니다.따라서 만약 우리가 함수가 하나 있다면, 함수에서, 그것은 부함수의 모든 변수에 접근할 수 있다.우리 예를 하나 봅시다.
    function main(){
        var a = 10;
        var b = 25;
    
        function test(){
            console.log(a+b);
        }
    
        test();
    }
    
    main();
    
    위의 예에서 우리는 주함수가 하나 있는데, 그것은 두 변수 a와 b가 있다. 주함수 중에서 우리는 또 다른 함수 테스트가 있다.테스트 자체에는 어떠한 변수도 없다.이것은 부모 변수에 접근합니다. 이 예에서 주 함수입니다.우리가 이 코드를 실행할 때, 출력은 35이고, 이것은 a와 b의 총합(10+25)이다.
    35
    
    기본적으로 자바스크립트는 변수 a와 b가 테스트 함수에 존재하는지 확인하려고 시도합니다.만약 그것이 존재하지 않는다면, 이 값들이 부모 대상에 존재하는지 확인하려고 시도할 것입니다.만약 이것도 존재하지 않는다면, 이것은 부모 대상의 부모 대상을 검사하려고 시도할 것이다.우리의 예에서 값 a와 b는 부함수 (즉 주함수) 에 나타나기 때문에 테스트에서 어떠한 오류도 발생하지 않았다.
    참고: 변수는 하위 수준에서 상위 수준으로만 액세스할 수 있으며 반대 방향으로는 액세스할 수 없습니다.만약 테스트 함수에 변수 a와 b가 존재한다면, 주 함수는 이 변수에 접근할 수 없습니다
    현재 우리는 자바스크립트의 작용역의 작업 원리를 이해했으니, 우리는 계속해서 첫 번째 함수를 토론할 것이다.

    클래스 함수
    javascript의 함수는 다른 대상과 똑같이 처리됩니다.함수를 매개 변수로 다른 함수에 전달할 수도 있고 변수에 저장할 수도 있고 다른 함수에서 함수를 되돌릴 수도 있다.예를 들면,
    function assigned(){
        console.log("this function is assigned to a variable");
    }
    
    var a = assigned;
    
    a();
    
    이 예에서, 우리는 변수에 분배되는 함수를 만들고 그것을 호출합니다.명명 함수를 만들어 변수에 지정하는 프로세스를 명명 함수 표현식이라고 합니다.이제 한 함수를 매개 변수로 다른 함수에 어떻게 전달하는지 봅시다.
    function one(x){
        console.log(x());
    }
    
    function two(){
        return "this is function two";
    }
    
    one(two);
    
    위의 예에서 우리가 전달한 것은 함수 2인데, 이것은 문자열을 함수 1에 되돌려준다.만약 우리가 이것을 운행한다면, 우리는 아래의 로그를 볼 것이다.
    this is function two
    
    일반적으로 매개 변수로 전달되는 함수를 리셋 함수라고 부른다.우리도 다른 함수에서 하나의 함수를 되돌릴 수 있다. 아래와 같다.
    function sample(){
        function test (){
            console.log("this is test function");
        }
    
        return test;
    }
    
    sample()();
    
    여기서 우리는 함수 예시에서 함수 테스트를 만듭니다.우리는 샘플의 어느 곳에서test를 호출하지 않고 되돌려줍니다.우리는 예시 뒤에 있는 두 개의 () 괄호를 통해 함수sample과 함수test를 호출합니다. 위 코드Sample()()와 같습니다.한 함수가 다른 함수를 매개 변수로 받아들이거나 되돌아올 때, 그것은 고급 함수라고 부른다.상술한 코드의 출력은 아래와 같다.
    this is test function
    
    지금까지 배운 지식을 활용해 폐쇄가 무엇인지 이해해 보자.

    폐쇄는 무엇입니까?
    우리는 이제 다른 함수 중의 어떤 함수도 부모 함수의 모든 변수에 접근할 수 있다는 것을 안다.우리도 우리가 이 함수를 되돌릴 능력이 있다는 것을 안다.그러면 부모 함수 변수에 접근하고 있는 함수를 되돌려주면 어떤 일이 일어날까요?봐라, 우리는 방금 무엇이 끝인지 알았다.
    MDN의 정의에 따르면 "클로즈업은 한데 묶인(폐쇄된) 함수와 그 주변 상태(어휘 환경)의 인용의 조합이다."기본적으로 그 부작용역 변수에 접근할 수 있는 함수는 그 부작용역과 함께 하나의 폐쇄를 형성한다.예를 들자.
    function parent(){
        var a = 10;
        var b = 25;
    
        function child (){
            console.log(a+b)
        }
    
        return child;
    }
    
    var x = parent();
    //300 lines of code;
    x();
    
    
    만약 우리가 상술한 함수의 출력을 본다면, 그것은 우리의 첫 번째 예와 같을 것이다.
    35
    
    이 예에서, 우리는 부 함수의 출력을 되돌려 변수 x에 분배했다. 300줄 코드에서 일부 처리를 한 후, 변수 x에 저장된 함수를 호출해서 부 함수에 접근할 수 있는지 확인하기로 결정했다.우리 해냈어!
    그러나 잠깐만, 만약 우리가 부함수를 호출하고 부함수를 되돌려준다면, 만약 우리가 부함수에서 부함수의 변수에 접근하려고 한다면, 우리는 정의되지 않은 것을 얻어야 합니까?답은 정해지지 않았다. 봐라, 이것이 바로 폐쇄의 묘미이다.비록 부모 함수가 실행을 마쳤고 호출 창고에서 더 이상 사용할 수 없더라도, 하위 함수가 사용하는 변수는 메모리에 저장되어 하위 함수에 참고할 수 있다.javascript 스팸 수집기는 하위 함수에 사용되고 있는 변수의 메모리를 제거하지 않습니다. 부 함수를 실행한 후에도 마찬가지입니다.
    만약 그렇다면, 그것은 일반 함수보다 더 많은 공간을 차지할 수 있습니까?네, 그럴게요.이것이 바로 우리가 코드를 클로즈업으로 채우지 않도록 조심해야 하는 이유이다. 그렇지 않으면 성능에 영향을 주고 심지어는 메모리 유출을 초래할 수도 있다.

    결론
    그래서 클립은 어법 범위(부 범위) 변수를 결합한 함수에 불과하다.이론적으로javascript의 모든 함수는 하나의 클립을 형성할 수 있다. 왜냐하면 그들은 전역 범위 내의 변수에 접근할 수 있기 때문이다.이 설명이 폐백을 더 잘 이해할 수 있기를 바랍니다.패키지는 자바스크립트에서 독특한 개념이 아니라 함수식 프로그래밍에서 매우 흔히 볼 수 있는 개념이다.클립을 이해하는 것은 틀림없이 다른 함수식 프로그래밍 개념을 더욱 잘 이해하는 데 도움이 될 것이다.

    좋은 웹페이지 즐겨찾기