JavaScript 함수 식 프로 그래 밍 - 포인트 찍 었 어!!

함 수 는 일등 공민 이다
함수 식 프로 그래 밍 에 대해 서 는 '함 수 는 1 등 시민' 이라는 말 을 많이 듣는다.그럼 우 리 는 이 말 을 어떻게 이해 합 니까?
'1 등' 이라는 용 어 는 일반적으로 값 을 묘사 하 는 데 쓰 인 다.그래서 우리 가 '함 수 는 일등 공민' 이 라 고 말 할 때, 즉 함 수 는 값 의 모든 특성 을 가지 고 있 기 때문에, 당신 은 한 값 을 보 는 것 처럼 함 수 를 볼 수 있다.예 를 들 어 숫자 는 JavaScript 에서 1 등 시민 이 고 숫자 가 가 진 특성 도 함수 에 의 해 가지 고 있 습 니 다.
  • 함 수 는 숫자 처럼 하나의 변수 로 저 장 될 수 있다
  • const num = 10;
    const fun = function() {
        return 10;
    }
  • 함 수 는 숫자 처럼 배열 의 한 요소 로 할 수 있다
  • const a = [10, function() { return 20; } ]
  • 함 수 는 대상 의 슬롯 에 숫자 처럼 존재 할 수 있 습 니 다
  • const b = {
        name: 'Tony',
        age: function() { 
            return 20; 
        }
    }
  • 함 수 는 숫자 처럼 사용 할 때 직접 만 들 수 있 습 니 다
  • 10 + (function() { return 20; })(); // 30
  • 함 수 는 숫자 처럼 다른 함수 에 의 해 되 돌아 갈 수 있다
  • const well = function() {
        return 10;
    }
    
    const good = function() {
        return function() {
            return 10;
        };
    }
  • 함 수 는 숫자 처럼 다른 함수 에 전 달 될 수 있다
  • 
    const fun = function(value) { 
        return value; 
    }
    
    const happy = function(func) {
        return func(5) * 10;
    }
    
    happy(fun); // 50

    마지막 두 가 지 는 바로 의 정의 이다. 만약 당신 이 지금 이해 하지 못 해도 상관없다 면 우 리 는 뒷부분 에서 그것 을 이야기 할 것 이다.
    변수 역할 영역 과 패 킷 닫 기
    변수 역할 영역
    변수의 역할 영역 과 패 키 지 는 자 바스 크 립 트 의 기초 로 서 함수 식 프로 그래 밍 을 배 우 는 데 매우 중요 하 다. 그것들 을 이해 해야만 우리 가 뒤에 말 하고 자 하 는 고급 함수 와 부분 응용 등 을 더욱 잘 이해 할 수 있다.
    변수의 역할 영역 에 대해 알 아야 합 니 다:
  • : JavaScript 에서 가장 긴 수명 주기 (한 변수의 시간 내 에 일정한 값 을 유지 하 는 지) 의 변 수 를 가지 고 있 으 며 그 변수의 생명 주 기 는 전체 프로그램 을 뛰 어 넘 을 것 입 니 다.
  • globalVariable = 'This is a global variable!';
  • : 어법 작용 역 은 한 변수의 가시 성과 그 텍스트 표현의 시 뮬 레이 션 값 을 가리킨다.
  • a = 'outter a';
    
    function good() {
        a = 'middle a';
        return function() {
            a = 'inner a';
            return 'I am ' + a;
        }
    }
    
    good(); // I am inner a

    PS: 이곳 의 예제 코드 는 단지 공 부 를 위해 서 입 니 다. 코드 를 이해 하기 어렵 게 만 들 기 때문에 이렇게 쓰 지 않 는 것 이 좋 습 니 다.
    위의 예 에서 우 리 는 각각 a 변수 에 대해 세 번 의 할당 을 했 습 니 다. 그러면 왜 마지막 으로 우리 가 a 의 값 을 받 은 것 은 'inner a' 이지 다른 것 이 아 닙 니까?
    우리 가 성명 a = 'outter a' 을 할 때 프로그램 은 창고 에 a 를 저장 할 공간 을 열 고 good() 함 수 를 실행 할 때 a = 'middle a' 를 성명 했다. 이때 창고 에 있 는 a 의 값 을 수정 하여 'middle a' 로 바 꾸 고 마지막 에 return 문 구 를 실행 할 때 우 리 는 다시 a = 'inner a' 창고 에 있 는 a 의 값 을 수정 하여 'inner a' 로 바 꿀 것 이다.그래서 위의 결 과 를 얻 었 다.
    같은 변수 에 여러 번 할당 할 때 마지막 으로 얻 은 값 은 사용 할 때 가장 가 까 운 할당 입 니 다.사용 할 때 가장 가 까 운 할당 값 을 찾 으 면 마지막 결 과 를 빠르게 얻 을 수 있 습 니 다.

  • 자 바스 크 립 트 의 동적 역할 영역 을 언급 하면 언급 할 수 밖 에 없다 this.this 관련 지식 이 많 으 니 나중에 시간 이 있 으 면 다시 자세히 말씀 드 리 겠 습 니 다.지금 우 리 는 this 가 가리 키 는 값 을 호출 자 에 의 해 확정 한 다 는 것 을 기억 합 니 다. 다음 코드 는 다음 과 같 습 니 다.
    function globalThis() { return this; }
    
    globalThis.call('APPLE'); //=> 'APPLE'
    globalThis.call('ORANGE'); //=> 'ORANGE'

  • 폐쇄 하 다
    폐쇄 적 이 라 고 하면 많은 사람들 이 골 치 아 플 것 이다. 이것 은 확실히 이해 하기 어 려 운 개념 이지 만 두려워 하지 마라. 그것 은 사실 그렇게 이해 하기 어렵 지 않다.
    패키지 정의
    패 킷 을 닫 는 것 은 함수 와 이 함 수 를 설명 하 는 문법 환경의 조합 입 니 다.
    패 킷 을 닫 는 것 은 사용 할 때 역할 영역 에 의 해 폐쇄 된 변수 와 함수 라 는 것 이다.패 킷 을 닫 으 면 함수 의 인자 와 변 수 를 캡 처 할 수 있 습 니 다.
    예 를 들 어:
    const fun = function() {
        const a = 10;
        return function(b) {
             return a + b;
        }
    }
    const myFunc = fun(); //    myFunc         ,         fun      a   ,b   。

    패 키 지 는 만 들 때 가 아니 라 사용 할 때 만 생 성 됩 니 다.위의 예 와 같이 fun 함수 만 만 만 들 고 마지막 fun () 을 실행 하지 않 으 면 fun 은 폐쇄 라 고 할 수 없습니다.이곳 의 패 키 지 는 fun 이 실 행 될 때 발생 하 는 역할 영역 이 어야 합 니 다. 이 역할 영역 은 fun 안의 변수 와 파 라 메 터 를 캡 처 했 습 니 다.
    폐쇄 적 특징
  • 패 킷 을 닫 으 면 하나의 값 (또는 참조) 을 캡 처 하고 같은 값
  • 을 여러 번 되 돌려 줍 니 다.
  • 새로운 패 킷 마다 다른 값 을 포착 합 니 다
  • 예 를 하나 더 보 겠 습 니 다.
    const fun = function() {
        return function() {
            return 10;
        }
    }
    
    const myFunc = fun(); // myFunc       
    
    const fun2 = function(value) {
        return function() {
            return value;
        }
    }
    const myFunc2 = fun2('AWESOME'); // myFunc2      
    myFunc2(); // AWESOME
    myFunc2(); // AWESOME      myFunc2   ,      
    
    const myFunc3 = fun2('HAPPY'); // myFunc3        
    myFunc3(); // HAPPY

    여기 서 my Func 는 엄격 한 의미 에서 하나의 패 킷 이 라 고 할 수 없습니다. 왜냐하면 fun 의 어떠한 변수 나 함수 의 전 삼 도 포착 하지 않 았 기 때 문 입 니 다.한편, my Func 2 는 fun 2 의 전 삼 을 잡 았 기 때문에 닫 힌 가방 입 니 다.
    폐쇄 적 소각
    패 킷 은 변수의 생명 주 기 를 지속 합 니 다. 수 동 으로 소각 하지 않 으 면 패 킷 안의 변 수 는 메모리 에 계속 존재 합 니 다.예 를 들 어 우리 가 수 동 으로 my Func = null 을 사용 할 때 가방 안의 변 수 를 쓰레기 로 회수 합 니 다.
    실 용적 인 폐쇄
    이렇게 많은 말 을 했 는데, 너 는 이런 의문 이 있 을 수 있다. 가방 을 닫 는 것 이 정말 유용 하 니?폐쇄 는 일반적으로 어떤 곳 에 사용 합 니까?
    * 1. 패 킷 을 닫 고 개인 적 인 방법 을 모 의 하여 공공 함수 가 개인 함수 와 변 수 를 방문 하여 데이터 의 숨 김 과 패 키 징 을 실현 할 수 있 도록 합 니 다.개인 적 인 방법 은 코드 에 대한 접근 을 제한 하고 네 임 스페이스 를 관리 하 는 강력 한 능력 을 제공 하여 비 핵심 코드 가 공공 인터페이스 에 대한 방 해 를 피 할 수 있다.
    const Counter = () => {
        let count = 0;
        
        const change = (a) => {
            count = count + a;
        }
        
        return {
            increase: () => {
                change(1);
            },
            decrease: () => {
                change(- 1);
            },
            value: () => {
                return count;
            }
        }
    }
    
    const func1 = new Counter();
    func1.value();  // 0
    
    func1.increase(); 
    func1.value(); // 1
    
    func1.decrease();
    func1.value(); // 0

    * 2. 하나의 고급 함 수 를 통 해 서로 다른 패 킷 을 생 성하 여 서로 다른 환경 을 저장 하 는 새로운 함 수 를 얻 을 수 있 습 니 다.
    아래 의 예 와 같이:
    const makeAdder = function(x) {
        return function(y) {
            return x + y;
        }
    }
    
    const add5 = makeAdder(5);
    const add10 = makeAdder(10);

    MakeAdder 는 함수 공장 으로 제 정 된 값 과 그 매개 변 수 를 합 친 함 수 를 만 드 는 데 사 용 됩 니 다.그것 을 통 해 우 리 는 두 개의 새로운 함수 add 5 와 add 10 을 만 들 었 다.add 5 와 add 10 은 모두 폐쇄 입 니 다.그들 은 같은 함수 정 의 를 공유 하고 있 지만 서로 다른 환경 을 저장 하고 있다.add 5 의 환경 에서 x 는 5 이지 만 add 10 에서 x 는 10 이다.
    고급 함수
    정의.
    아래 의 임의의 조건 중 하 나 를 만족 시 키 면 고급 함수 라 고 할 수 있다.
  • 하나 이상 의 함 수 를 매개 변수 로 한다
  • 하나의 함 수 를 되 돌려 주 는 결과
  • 우리 가 흔히 볼 수 있 는 map, find, reduce 는 모두 함 수 를 인삼 으로 하 는 함수 이기 때문에 모두 고급 함수 입 니 다.
    함수
    함 수 를 함수 의 매개 변수 로 사용 하면 더욱 유연 한 함 수 를 만 들 수 있 습 니 다.매개 변 수 를 값 에서 함수 로 바 꾸 면 우 리 는 더 많은 가능성 을 얻 을 수 있다.호출 할 때, 우 리 는 서로 다른 함 수 를 전달 함으로써 서로 다른 수 요 를 완성 할 수 있 기 때문이다.
    아래 의 예 와 같다.
    const finder = function(val, func) {
        return val.reduce(function(prev, current) {
            return func(prev, current);
        });
    }
    
    const a = [1, 2, 3, 5, 8];
    finder(a, Math.max); // 8
    finder(a, Math.min); // 1

    finder 함 수 를 사용 할 때 서로 다른 함수 가 들 어 와 서 완전히 다른 결 과 를 얻 었 습 니 다.이것 도 우리 가 '값 이 아니 라 함 수 를 사용 하 라' 고 강조 하 는 이유 다.
    함수 로 결 과 를 되 돌려 주 는 함수
    함수 로 결 과 를 되 돌려 주 는 함수 로 강력 한 함 수 를 구축 할 수 있 습 니 다.앞에서 말씀 드 렸 던 폐쇄 기억 나 세 요?고급 함수 MakeAdder 를 통 해 우 리 는 add 5 와 add 10 두 개의 새로운 함 수 를 생 성 했 습 니 다.패 킷 을 닫 을 수 있 는 함 수 를 만 들 수 있 습 니 다. 사실은 모두 고급 함수 입 니 다.
    여기까지, 첫 번 째 부분의 중점 내용 은 다 말 했다.다음 부분 에서 우 리 는 함수 식 프로 그래 밍 에 남 은 몇 가지 중요 한 부분 을 이야기 할 것 이다.
  • 코 리 화 와 조합
  • 부분 응용
  • 재 귀
  • 흐름 기반 프로 그래 밍
  • 좋은 웹페이지 즐겨찾기