Programming/Javascript (78) 썸네일형 리스트형 15. Javascript 함수형 프로그래밍 적용(6) - reduce reduce( ) 함수는 앞서 살펴본 map과도 약간 유사한 형태를 띠는 함수입니다. 이 함수는 배열의 각 요소를 하나씩 꺼낸 다음 사용자가 정의한 함수를 적용시킨 후, 그 결과 값을 계속해서 누적하는 기능을 합니다. Array.prototype.reduce = function(callback, memo) { // this(obj)가 배열인지 확인 필요함 // callback이 함수인지 확인 필요함 var obj = this; var value; var accumulated_value = 0; for(var i = 0; i < obj.length; i++) { value = obj[i]; accumulated_value = callback.call(null, accumulated_value, value).. 15. Javascript 함수형 프로그래밍 적용(5) - map map 함수 역시 앞서 살펴본 each와 비슷하지만, 활용 방식이 약간 다른 함수입니다. 배열에 주로 사용되며, 배열의 요소 각각을 꺼내 사용자가 정의한 함수에 적용한 후, 새로운 값을 얻은 다음 그 결과 값을 새로운 배열에 넣는 형태로 동작하게 됩니다. 한 번 예제를 살펴보도록 하겠습니다. Array.prototype.map = function(callback) { var obj = this; var value; var mapped_value; var A = new Array(obj.length); for(var i = 0; i < obj.length; i++) { value = obj[i]; mapped_value = callback.call(null, value); A[i] = mapped_valu.. 15. Javascript 함수형 프로그래밍 적용(4) - each 함수형 프로그래밍의 특성을 통해 구현하는 반복 함수에 대해서 살펴보도록 하겠습니다. 우선 가장 먼저 알아볼 반복 함수는 each( )입니다. 주로 프로그래밍 언어들에서 each, forEach로 제공되는 함수입니다. each( ) 함수는 배열의 각 요소 또는 객체의 각 프로퍼티를 하나씩 꺼낸 다음, 순서대로 특정 함수에 인자로 전달해 실행시키는 역할을 하게 됩니다. each함수의 예제를 살펴보도록 하겠습니다. 여기서 소개하는 예제는 jQuery 1.0의 each( ) 함수를 기준으로 합니다. function each(obj, fn, args) { if(obj.length == undefined) { for(var i in obj){ fn.apply(obj[i], args || [i, obj[i]]); }.. 15. Javascript 함수형 프로그래밍 적용(3) - wrapper Javascript의 wrapper(래퍼) 함수는 간단하게 말해 다른 OOP 언어들의 다형성을 구현하는 '오버라이드(override)' 기능과 동일하다고 생각하면 됩니다. 여기서는, original이라는 원본 함수가 있는데, 여기에 다른 익명의 함수를 대입해 실행하게 만드는 예제를 생성해 보도록 하겠습니다. function wrap(object, method, wrapper) { // 이 예제에서는, fn = Function.prototype.original var fn = object[method]; return object[method] = function() { return wrapper.apply(this, [fn].concat(Array.prototype.slice.call(arguments)).. 15. Javascript 함수형 프로그래밍 적용(2) - bind bind 함수에 대해서도 한번 살펴보겠습니다. bind 함수는 기본적으로 curry와 그 용도가 비슷한 함수입니다. 고정하고자 하는 인자 값을 bind 호출 시 넘겨주고, 거기서 클로저로 반환받은 함수를 호출하면서 사용자가 나머지 가변 인자를 지정할 수 있는 방식을 지원합니다. curry와 다른 점은, 함수 호출 시 this에 바인딩할 객체를 직접 지정할 수 있다는 점이죠. curry를 충분히 대체하는 함수입니다. Function.prototype.bind = function(thisArg) { var fn = this; var slice = Array.prototype.slice; var args = slice.call(arguments, 1); // bind의 파라미터 값 중 인덱스 1번 부터 전부 .. 15. Javascript 함수형 프로그래밍 적용(1) - 필수 선행지식 + 커링(curry) 3 앞서 구현해 본 커링의 경우, Javascript에서는 기본적으로 제공되는 메서드는 아닙니다. 그래서 프로토타입 함수로 정의하여 사용하는 것이 일반적입니다. 앞서 calculate 함수 사례를 프로토타입 메서드로 정의해 실행해 보도록 하겠습니다. function calculate(a, b, c) { return a * b + c; } Function.prototype.curry = function() { var fn = this; var args = Array.prototype.slice.call(arguments); console.dir(args); return function() { return fn.apply(this, args.concat(Array.prototype.slice.call(argum.. 15. Javascript 함수형 프로그래밍 적용(1) - 필수 선행지식 + 커링(curry) 2 앞서 살펴본 커링 구현 예제를 계속 살펴보도록 하겠습니다. 15. Javascript 함수형 프로그래밍 적용(1) - 필수 선행지식 + 커링(curry) 1 앞서 살펴본 함수형 프로그래밍 기법을 통해, 현재 통용되는 몇 가지 함수를 재구현하거나 구조를 응용해 보도록 하겠습니다. 우선, 이 과정을 위해서는 몇 가지 잊어서는 안 되는 선행 지식들 nozeroslope.tistory.com function calculate(a, b, c) { return a * b + c; } function curry(func) { var args = Array.prototype.slice.call(arguments, 1); console.dir(args); return function() { return func.appl.. 15. Javascript 함수형 프로그래밍 적용(1) - 필수 선행지식 + 커링(curry) 1 앞서 살펴본 함수형 프로그래밍 기법을 통해, 현재 통용되는 몇 가지 함수를 재구현하거나 구조를 응용해 보도록 하겠습니다. 우선, 이 과정을 위해서는 몇 가지 잊어서는 안 되는 선행 지식들이 있는데, 커링을 구현하면서 차례로 같이 살펴보도록 하겠습니다. 우선 '커링'을 먼저 정의해 보겠습니다. 커링은 "특정 함수에서 정의-선언된 파라미터의 값 일부를 고정하고, 나머지 파라미터에 전달된 인자로 받는 함수를 생성하는 것"을 의미합니다. 우선 예제 코드를 먼저 살펴보고, 여기에 필요한 몇 가지 선행지식에 대한 설명부터 진행하겠습니다. (물론, 다 알고 있어야 하는 내용이지만 해당 내용을 정리하는 제가 머리가 나빠서 다 잊어버렸더라구요...ㅠ) function calculate(a, b, c) { return a.. 이전 1 2 3 4 ··· 10 다음
