JavaScript 의 패키지 와 고급 함수 (1)

여 기 를 클릭 하여 나의 github 를 방문 하여 더 자세 한 정 보 를 알 아 보 세 요.
JavaScript 는 대상 을 향 한 프로 그래 밍 언어 이지 만 Lambda 표현 식, 패 킷 닫 기, 고급 함수 등 함수 식 프로 그래 밍 의 특성 도 많이 있 습 니 다.
함수 식 프로 그래 밍 은 프로 그래 밍 패 러 다 임 으로 컴퓨터 연산 을 함수 의 계산 으로 간주한다.함수 프로 그래 밍 언어 에서 가장 중요 한 기 초 는?λ 연산.게다가λ연산 함 수 는 함 수 를 입력 (매개 변수) 과 출력 (반환 값 으로 받 아들 일 수 있 습 니 다.
폐쇄 하 다
패 킷 을 닫 는 것 은 무엇 입 니까? 패 킷 을 닫 는 여러 위치 에 대해 각자 의 견 해 를 가지 고 있 습 니 다. 지금 은 패 킷 을 닫 는 것 은 외부 역할 영역 에서 변수 와 매개 변 수 를 방문 할 권리 가 있 는 함 수 를 말 합 니 다. 가장 흔히 볼 수 있 는 것 은 특정한 함수 내부 에 다른 함 수 를 만 드 는 것 입 니 다. 예 를 들 어:

    var count = (function() {
        var item = 0;
        
        return {
            add: function(num) {
                item += typeof num === 'number' ? num : 1;
            },
            value: function() {
                return item;
            }
        }
    })();

함수 가 되 돌아 오 는 결 과 를 count 에 할당 합 니 다. 이 함 수 는 두 가지 방법 을 포함 하 는 대상 을 되 돌려 줍 니 다. 대상 의 방법 은 함수 에 포 함 된 변수 와 매개 변 수 를 방문 할 수 있 습 니 다. count 에 저 장 된 것 은 이 대상 의 참조 입 니 다. 대상 의 방법 은 실행 함수 에 있 는 변 수 를 방문 할 수 있 고 변수 자체 에 접근 할 수 있 습 니 다.
패 킷 함 수 는 만 들 때 있 는 컨 텍스트 환경 에서 의 변수 와 매개 변수 에 접근 할 수 있 습 니 다. this 및 arguments 는 제외 합 니 다.
폐쇄 는 사실 잘 논술 되 지 않 습 니 다. 저 에 게 있어 서 자기 이해 와 다른 사람 에 게 논술 하 는 차이 가 매우 크 지만 이 를 정복 하려 고 합 니 다. 폐쇄 의 형성 은 변수 와 밀접 한 관 계 를 가지 고 있 습 니 다. 특히 변수의 역할 과 변수의 생명 주 기 는 자세히 보 세 요.
패키지 와 변수
패 킷 에 저 장 된 것 은 전체 변수 대상 인 실행 환경 (문맥 환경) 에서 변 수 를 나타 내 는 대상 의 참조 입 니 다. 실행 환경 에 접근 하 는 변 수 는 이 변수 대상 에 접근 하 는 변수 입 니 다.
변수 대상 의 모든 실행 환경 (상하 문 환경) 중 하 나 는 모든 변 수 를 나타 내 는 대상 이 고 전역 환경의 변수 대상 은 항상 존재 하 며 국부 환경의 변수 대상 은 그 실행 과정 에서 만 존재 한다.
전형 적 인 사례 는 다음 과 같다.

    function myNumber() {
        var count = [];
        for (var i = 0; i < 10; i ++) {
            count[i] = function() {
                return i;
            }
        }
        return count;
    }

이 함 수 는 함수 배열 을 되 돌려 줍 니 다. 이 배열 은 순 순 히 자신의 숫자 로 돌아 갈 수 있 습 니까? 물론 입 니 다. 사실은 모든 함수 가 10 으로 되 돌아 갑 니 다. 왜 일 까요? 자세하게 말 하면 모든 함수 의 역할 영역 체인 에 my Number () 함수 의 활동 대상 (변수 대상) 이 저장 되 어 있 기 때 문 입 니 다.그들 은 모두 같은 변수 대상 을 인용 합 니 다. 물론 같은 변수 i 도 참조 합 니 다. my Number () 함수 가 돌아 온 후에 i 는 10 입 니 다.
다음 코드 를 보십시오.

    function myNumber() {
        var count = [];
        for (var i = 0; i < 10; i ++) {
            count[i] = （function(num) {
                return function() {
                    return num;
                };
            })(i);
        }
        return count;
    }

이 곳 에서 익명 함수 결 과 를 배열 에 할당 하고 모든 익명 함 수 를 호출 할 때 변수 i 를 입력 합 니 다. 함수 매개 변 수 는 값 에 따라 전달 되 며 변수 값 을 매개 변수 num 에 복사 합 니 다. 이 익명 함수 내부 에서 num 매개 변수 에 접근 하 는 패 키 지 를 만 들 고 되 돌려 줍 니 다. count 배열 의 함 수 는 모두 자신의 num 변수 가 있 는 사본 을 저장 하여 각자 의 값 을 되 돌려 줍 니 다.
변수의 역할 영역
변 수 는 전역 변수 와 국부 변수 로 나 뉘 는데 함수 에서 변 수 를 설명 할 때 var 키워드 로 정 의 된 변 수 는 국부 변수 이 고 var 키 워드 를 가지 고 있 지 않 으 면 전역 변수 가 된다.

    
    var c = 3
    var func = function() {
        var a = 1;
        b = 2;
        alert(b);//2
        alert(c);//3
    }
    func();
    alert(b);//2
    alert(a);//Uncaught ReferenceError: b is not defined

함수 에서 변 수 를 찾 을 때 먼저 현재 함수 에서 환경 역할 도 메 인 을 찾 습 니 다. 찾 지 못 하면 현재 실행 환경 에서 만 든 역할 도 메 인 체인 에 따라 외부 로 찾 습 니 다. 전체 대상 까지 여기 서 찾 는 것 은 내부 에서 외부 로 찾 는 것 입 니 다.
변수의 생명주기
위 에서 변수 역할 영역 에 대해 말 했 는데 여기 서 변수 수명 주 기 를 이야기 합 니 다.

전역 변 수 는 전체 프로그램 이 실행 되 는 시간 내 에 영구적 으로 존재 합 니 다. 주동 적 으로 소각 하지 않 으 면 수시로 호출 할 수 있 습 니 다.

부분 변 수 는 소속 역할 도 메 인 코드 를 실행 하 는 과정 에서 존재 합 니 다. 실행 이 완료 되 고 외부 에서 이 컨 텍스트 환경 을 호출 하 는 변수 가 존재 하지 않 을 때 소각 되 고 그렇지 않 으 면 존재 합 니 다.

    var func = function() {
        var res = [1,2,3,4,5,6];
        var a = 0;
        return function() {
            alert(res[a]);
            a++;
        }
    };
    var f = func();
    
    func()();//1
    func()();//1
    
    f();//1
    f();//2
    f();//3

fun () 과 f () 의 팝 업 값 을 비교 해 보 세 요. f () 에 a 가 계속 존재 하 는 것 같 습 니 다. var f = func () 를 실행 할 때 f 함 수 는 익명 함수 의 참조 로 되 돌아 갑 니 다. 이 익명 함 수 는 func () 가 호출 되 었 을 때의 컨 텍스트 환경 (실행 환경) 에 접근 할 수 있 습 니 다.국부 변 수 는 그 중에서 국부 변수 가 처 한 환경 이 외부 에 접근 할 수 있 고 국부 변 수 는 소각 되 지 않 는 다.
폐쇄 적 역할

패 키 징 변수

패 킷 을 닫 으 면 '사유 변수' 를 형성 할 수 있 습 니 다. 예 를 들 어 계산 곱 하기:

    var mult = function() {
        var a = 1;
        for (var i = 0, len = arguments.length; i < len; i++) {
            a = a * arguments[i];
        }
        return a;
    }
    alert(mult(1,2,3,4));

블록 급 역할 영역 모방

JavaScript 에 블록 급 역할 영역 이 없다 는 개념 입 니 다. 예 를 들 어:

    function block() {
        var res = [1,3,5,7,9];
        for (var i = 0; i < res.length; i++) {
            alert(res[i]);
        }
        var i;//      
        alert(i);//5
    }

위 코드 에서 보 듯 이 i 변 수 는 정 의 된 후에 전체 함수 에 접근 할 수 있 습 니 다. JavaScript 에서 for 문 구 는 블록 급 역할 도 메 인 을 형성 하지 않 습 니 다. 전체 역할 도 메 인 은 함수 생 성 을 포함 하고 변수 에 대한 후속 성명 은 무 시 됩 니 다. 블록 급 역할 도 메 인 효 과 를 얻 으 려 면 폐쇄 적 으로 모방 할 수 있 습 니 다. 예 를 들 어:

    (function() {
        //     
    })()

개인 변수 나 함수 추가

개인 역할 영역 에서 개인 변수 나 함 수 를 정의 함으로써 개인 구성원 을 형성 할 수 있 습 니 다. 예 를 들 어:

    (function() {
        var name = 'xjg';
        function getName() {
            reutn name;
        }
        Person = function(val) {
            name = val;
        }
        Person.getName = function() {
            return name;
        }
    })();
    var p1 = new Person('Anagle');
    alert(p1.getName());//Anagle
    alert(getName())//ReferenceError: getName is not defined

이 곳 에서 name 은 정적 개인 변수 가 되 었 습 니 다.
패 킷 및 메모리 누설
부분 변 수 는 원래 함수 가 종 료 될 때 소각 되 었 으 나 패 킷 에 서 는 그렇지 않 습 니 다. 부분 변 수 는 수명 주기 가 길 어 지고 패 킷 을 닫 으 면 이 데 이 터 를 제때에 소각 하지 못 하고 메모 리 를 점용 하여 메모리 누 출 을 초래 하기 쉽 습 니 다. 예 를 들 어:

    function addHandle() {
        var element = document.getElementById('myNode');
        element.onclick = function() {
            alert(element.id);
        }
    }

이 곳 에서 onclick 익명 함 수 는 함수 활동 대상 (변수 대상) 을 포함 하 는 인용 을 저장 합 니 다. element 의 인용 을 저장 하면 element 는 회수 되 지 않 습 니 다.

        function addHandle() {
        var element = document.getElementById('myNode');
        var id = element.id;
        element.onclick = function() {
            alert(id);
        }
        element = null;
    }

이 곳 은 element 를 null 로 설정 합 니 다. 즉, 인용 을 해제 하고 쓰레기 회수 기 는 메모리 사용량 을 회수 합 니 다.
이 편 은 자 바스 크 립 트 패키지 에 대해 정리 하고 논술 하 였 으 며, 지면 에 한 하여 다음 편 에서 자 바스 크 립 트 의 고급 함 수 를 설명 하 였 다.