JS 기초 - 고급 함수

정의.
고급 함 수 는 적어도 다음 조건 을 만족 시 키 는 함수 입 니 다. 1. 하나 이상 의 함 수 를 매개 변수 로 받 습 니 다.예 를 들 어 filter 함수 2. 함 수 를 되 돌려 줍 니 다.예 를 들 어 bind 함수 예 를 들 어 예 를 들 어 우 리 는 배열 [1,2,3,4,5] 에서 3 이상 의 모든 요 소 를 걸 러 야 한다. 우리 의 일반적인 실현 방법 은 다음 과 같다.

let newArr = [];
for(let i = 0,len = arr.length; i < len; i++){
    arr[i] > 3 && newArr.push(arr[i])
}

배열 filter 방법 을 사용 하면 let newArr = arr.filter((item) => {return item > 3}) 만 필요 하 다.물론 우 리 는 고급 함 수 를 통 해 스스로 실현 할 수 있다.

Array.prototype.myFilter = function (fn){
    let newArr = [];
    for(let i = 0,len = this.length; i < len; i++){
        fn(this[i]) && newArr.push(this[i])
    }
    return newArr;
}
[1,2,3,4,5].myFilter((item) => { return item > 3})

우 리 는 고급 함 수 를 봉 하여 우리 의 코드 를 복용 하고 간소화 할 수 있다.
코 리 화
코 리 화 는 하나의 다 중 매개 변수의 함 수 를 여러 개의 단일 매개 변수 로 변환 하 는 함수 로 이 함 수 는 다음 매개 변 수 를 처리 하 는 함수 로 되 돌아 갑 니 다.fn(a,b,c) 를 newFn(a)(b)(c) 이런 이미지 로 바 꾸 는 것 이다.코 리 화 에서 흔히 볼 수 있 는 응용 은 매개 변수 재 활용, 지연 계산 이다.예 를 들 어 우 리 는 인터페이스 주 소 를 연결 하 는 함수 가 있다.

function getUrl(service,context,api){
    return service + context + api;
}
let loginUrl = getUrl('http://localhost:8080/','auth','/login')  
let logoutUrl = getUrl('http://localhost:8080/','auth','/logout')

매번 앞의 두 매개 변수의 값 이 같 습 니 다. 우 리 는 코 리 화 를 통 해 매개 변수 재 활용 에 도달 할 수 있 습 니 다.

function curry(fn){
    let args = Array.prototype.slice.call(arguments,1);    
    return function(){
        let innerArgs = Array.prototype.slice.call(arguments);
        let finalArgs = args.concat(innerArgs);
        if(finalArgs.length < fn.length){         //fn.length        
            return curry.call(this,fn,...finalArgs)
        }else{
            return fn.apply(null,finalArgs)
        }
    }
}
var getAuthUrl = curry(getUrl,'http://localhost:8080/','auth');
let loginUrl = getAuthUrl('/login')
let logoutUrl = getAuthUrl('/logout')

조합 함수
조합 함 수 는 파이프 와 유사 합 니 다. 여러 함수 가 실 행 될 때 이전 함수 의 반환 값 은 자동 으로 두 번 째 매개 변수 로 전 송 됩 니 다.예 를 들 어 url 의 인 자 를 바 꿉 니 다.

function replaceToken(str){
    return str.replace(/{token}/g,'123455')
}
function replaceAccount(str){
    return str.replace(/{account}/g,'xuriliang')
}
replaceAccount(replaceToken('http://localhost/api/login?token={token}&account={account}'))

우 리 는 이러한 끼 워 넣 은 쓰기 방법 을 이용 하여 실현 할 수 있 지만, 너무 많이 끼 워 넣 으 면 코드 의 가 독성 이 그다지 좋 지 않다.물론 우 리 는 한 함수 에서 과정 을 나 누 어 실현 할 수 있 지만 이런 함 수 는 단일 원칙 에 부합 되 지 않 는 다.함수 조합 을 이용 하여 우 리 는 이렇게 쓸 수 있다.

function compose() {
    var args = arguments;
    var start = args.length - 1;
    return function() {
        var i = start;
        var result = args[start].apply(this, arguments);
        while (i--) result = args[i].call(this, result);
        return result;
    }
}
compose(replaceToken,replaceAccount)('http://localhost/api/login?token={token}&account={account}')

조합 함 수 는 우리 로 하여 금 통용 되 는 함 수 를 사용 하여 각종 복잡 한 연산 을 조합 할 수 있 게 한다.이것 도 함수 프로 그래 밍 pointfree 의 개념 이다.