> 웹 프론트엔드 > JS 튜토리얼 > javascript_javascript 기술의 일반적인 고차 함수 응용 프로그램 소개

javascript_javascript 기술의 일반적인 고차 함수 응용 프로그램 소개

WBOY
풀어 주다: 2016-05-16 17:43:58
원래의
1127명이 탐색했습니다.

이유
이전에 JavaScript 언어를 사용해 본 적은 있지만 결국 JavaScript 프로젝트는 물론 백엔드와 협력하기 위해 작성된 일부 "코드 조각" 때문이었습니다. 프로젝트가 철거되고 다시 작성되기 시작한 지난달에 회사에 막 도착하게 된 것을 영광으로 생각합니다. 우리 팀은 이전 버전을 개선하고 능가한다는 매우 명확한 목적을 가지고 처음부터 아키텍처와 구현을 시작했습니다. 이것은 실제 JavaScript "프로젝트"입니다. 물론 우리 팀은 서버 측에 대한 책임을 지지 않습니다. 이는 제가 실제로 JavaScript 프로그래밍을 풀타임으로 시작한 시기이기도 합니다. 학교에서는 형식적인 방법에 더 관심이 많았고, JavaScript는 함수형 언어이기 때문에 JavaScript를 사용하여 좀 더 함수적인 것을 표현하고 싶었습니다.

여러 함수
이러한 메서드는 모두 javascript 1.6 배열에 대한 새로운 메서드입니다. 매우 전형적인 기능적 기능이면서, 물론 매우 실용적이기도 합니다. 다음 기능 정의는 javascript에서 나온 것이 아닙니다.

filter: Xs 집합(X는 유형을 나타내고 s는 집합을 나타냄)과 조건자를 허용합니다. 이 조건자는 X에서 bool로의 매핑(함수)입니다. 그런 다음 이 세트를 필터링하고 조건자가 참인 요소 세트를 반환합니다. 다음은 간단한 구현입니다.

코드 복사 코드는 다음과 같습니다.

함수 필터 (arr,callback ){
var i,out=[]
for(i=0;iif(callback(arr[i]))
out.push (arr[i]);
}
return out
}

간단한 테스트 추가:
코드 복사 코드는 다음과 같습니다.

var arr = [1,2,3,4,5,6,7,8, 9,10];
var even = function(item){
if(typeof item !== "number") return false
return !(item & 1)
varfiltered = filter(arr,even);
console.log(filtered);

결과:
2,4,6,8,10
맵: 집합 Xs, 함수 f를 받아들인 다음 f를 순서대로 사용하여 Xs 집합의 각 요소를 매핑하고 집합 f x1, f x2, f x3...f xn을 반환합니다. 구현은 다음과 같습니다.

코드 복사 코드는 다음과 같습니다.
함수 맵( arr,callback){
var i,l= arr && arr.length || 0,out = new Array(l)
for(i=0;iout[ i]=callback(arr [i]);
return out;
}

테스트해 보세요.

var arr = [1,2,3,4,5,6,7,8,9,10]
var addTen = function(item) {
return item 10;
}
var mapAdded = map(arr,addTen)
console.log(mapAdded); >
결과:
11,12,13,14,15,16,17,18,19,20
또한 JavaScript 1.6에 등장한 forEach, Every, Some의 세 가지 함수가 있습니다. . 하지만 사용하는 과정에서 아직도 강력한 기능, 즉 접기 기능이 빠져 있다는 느낌이 듭니다. map-reduce라는 속담처럼, "reduce" 없이 map을 갖는 것은 실망스럽지 않을까요? 이 "감소"에 대해 살펴보겠습니다.


Reduce 구현

위에서 언급한 Reduce는 사실 접기 기능(fold)입니다. X 세트와 이진 연산자 f를 허용합니다. 그런 다음 세트의 인접한 두 요소마다 f가 삽입됩니다. 예를 들어, 접기 더하기 [1,2,3,4]는 1 2 3 4를 의미합니다. 더 정확하게 말하면, 일반적으로 f의 시작 부분에 두 번째 매개변수로 "시작 요소"가 필요합니다. 예를 들어 접기 더하기 [1,2,3,4]는 (1 (2 (3 (4 0))))을 의미합니다. 구현은 다음과 같습니다.


복사 code
코드는 다음과 같습니다. functionfold(arr,callback,b){ var i,x
if(b) x=b,i= 0;
else x=arr[0],i=1
for(;ix=callback(arr[i],x );
return x;


테스트:


코드 복사

코드는 다음과 같습니다: var arr = [1,2,3,4,5,6,7,8,9,10] var plus = function(a,b ){ return a b; };
varfoldPlus =fold(arr,plus,0)
console.log(foldPlus);
결과:
55

이 함수는 ECMAScript 5에서는 Reduce라고 부르는데, 함수식에서는 보통fold라고 부릅니다. 아주 생생한 이름입니다.
요약
사실 위의 함수들을 구현할 때의 작성 스타일은 함수적이지 않습니다. 왜냐하면 자바스크립트 언어에는 루프문이 있기 때문입니다. 루프문이 없으면 어떻게 되나요? 다음 탐색에 맡겨주세요.
관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿