함수형 프로그래밍과 JavaScript ES6+

함수형 프로그래밍과 JavaScript ES6+

(14개의 수강평)

413명의 수강생
42% 할인 23일 남음

44,000원77,000원

유인동
평생
초급, 중급
수료증
71개 수업, 총 8시간 7분
Wishlist
vanila 프로필

L.flatten 평가 시점 관련 vanila 5일 전

flatten -> L.flatten  적용이 되어도 즉시 평가가 되는 이유가 무엇인가요? 

4
iternity 프로필

catchNoop을 해줘야되는 이유에 대해서 궁금한게있습니다. iternity 24일 전

한 콜스택 내에서 error를 catch하지 못했기 때문에 error가 콘솔에 뿜어져서 catchNoop을 해준다고 하셨는데요.

C.reduce가 아니라 그냥 reduce의 경우에는 세로로 하나씩 실행되면서 filter가 Promise.reject(nop)을 리턴할 때가 있는데요. 이 call stack이 끝나고 reduce에 의해 recur이 실행되어 L.map으로 넘어가는데 L.map이 받은 Promise.reject(nop)은 filter와 다른스택 아닌가요? 제 생각으로는 L.map으로 가기전에 L.filter의 처리를 담은 프로미스가 끝나서 한 call-stack이 끝나고 C.reduce와 마찬가지로 에러를 만들어야될 것 같은데 아니네요. 

 

1
vanila 프로필

go 함수의 사용할때 vanila 28일 전

안녕하세요,

const _go = (...args) => _reduce((a, fns) => fns(a), args) 

리턴 부분의 args  는 처음 인자인 0 을 받아주기위해서 인가요??

끝부분의 args 의 role 을 알고싶습니다..

2
vanila 프로필

curry를 사용하여 축약할때, iter 에 관한 질문 vanila 29일 전

_go(
  products,
  _filter(p => p.price < 20000),
  _map(p => p.price),
  _reduce(add),
  console.log
)
const _go = (...args) => _reduce((a, fns) => fns(a), args 

여기에서 args 를 명시하지 않아도 되기 때문에 간결한 코드가 나오게 되었는데, curry 함수의 어떤 부분이 iter 될 args 가 없음에도 작동하는지 알고싶습니다.

2
vanila 프로필

curry 함수의 내부 vanila 1달 전

const curry = f => (a, ..._) => _.lenght ? f(a, ..._) : (..._) => f(a, ..._);

위 함수에서 a 는  log 에서 받은 params 들이 두개 이상 저장되는 곳이라고 볼수있나요?

2
vanila 프로필

pipie 함수 관련 vanila 1달 전

const _pipe = (f, ...fns) => (...args) => _go(f(...args), ...fns)

 

두가지 질문이 있습니다

첫째,

위 부분에서 첫번째 함수만 꺼내고 나머지 함수를 뒤로 보낸다는 부분이 f = (a, b) => a + b, ...fns = 나머지  follow up 함수들을 말하는 것인가요?

둘째, 

위 코드 라인에서 accumulator 역할을 하는 부분이 _go 함수의 ...fns 부분일까요?

 

1
vanila 프로필

안녕하세요, reduce 함수의 사용법에 질문드리고 싶습니다 vanila 1달 전

const _reduce = (fns, acc, iter) => {
  if(!iter){
    iter = acc[Symbol.iterator]();
    acc = iter.next().value;
  }
  for (const a of iter){
    acc = fns(acc, a);
  }
  return acc
};

console.log(
  _reduce(
    (total_price, product) => total_price + product.price, 
    0,
     products)
);

 

2
iternity 프로필

나머지연산자의 사용법에 대해 질문있습니다. iternity 1달 전

github에 있는 functional es 코드를 보는중에 정말 이해가 안되는부분이 있어 질문드립니다.

  const aa = (a, ...before) => go(
        a,
        a => a + 3,
        ...before, // <--- before에 걸리는 함수가 있으면 여기에 추가될 예정
        a => a + 6,
        console.log);

    aa(1);

...before 이런 기법을 통해서 앞으로 올 함수들과 조합할 수 있다고 하셨는데요. go가 중간에 []를 만나게되서 에러가 나야되지않나요? 실제로 디버깅해보면 문제없이 작동하고 go가 받은 인자들을 reduce로 넘길때 ...before은 무시됩니다. 그래서 ...before대신에 []을 그냥 넣어봤더니 이번엔 에러가 납니다.
go나 reduce내부에서 []나 undefined를 만났을때 다루는 코드가 있나? 하고 코드를 봤더니 그런것도 없습니다.

왜 ...연산자를 통해 받은 ...before만 go의 내부에서 reduce함수로 갈때 무시되는건가요?

2
iternity 프로필

이 강좌에 대한 질문은 아닌데 질문이 있습니다. iternity 2달 전

선생님의 함수형 프로그래밍 책을 사서 혼자 학습하고 인프런 함수형프로그래밍 무료강의를 막 다듣고 책 복습하고 있는 학생인데요.

함수형 프로그래밍 책의 2장의 비동기와 재귀부분의 코드를 읽는데

설명이 간략하게만 나와있어서 질문드립니다.

function _async(func) {
    return function() {
        arguments[arguments.length++] = function(result) {
            _callback(result);
        };
        // 변경된 부분
        (function wait(args) {
            /* 새로운 공간 추가 */
            for (var i = 0; i < args.length; i++)
                if (args[i] && args[i].name == '_async_cb_receiver')
                    return args[i](function(arg) { args[i] = arg;
                   // func.apply(null, args);
                    wait(args);
                        });
            func.apply(null, args);
        })(arguments);
        var _callback;
        function _async_cb_receiver(callback) {
            _callback = callback;
        }
        return _async_cb_receiver;
    };
}

log(div(sub(add(10, 15), 5), 10));

이 코드에서요. wait()이 하는 역할이 잘 이해가 되지않습니다.

제가 이해한 바로는

log->div->sub->add순으로 call stack에 쌓이고

add실행 시, async를 받고 wait(args) 실행할때는 _async_cb_receiver가 없기 때문에 그냥 반복문만 돌고 func.apply()되고

그다음 sub가 실행되는데 add가 async_cb_receiver를 리턴하여 첫번째 인자 args[0]에 걸려서

return add의 _async_cb_receiver(function(arg) { args[i] = arg; wait(args)}); 를 실행합니다.

여기서, _ async_cb_receiver함수는 _callback 변수에 인자로 들어간 익명함수를 할당하고 다시 _async_cb_receiver를 리턴합니다.

마찬가지로 이것이 반복되어 log까지 실행되고,

백그라운드에는 add, sub, div, log의 setTimeout이 시간을 세다가 task queue로 돌아와서 main이 종료되고 wait과 args를 참조하는 클로저인 콜백함수들이 이벤트 루프에 의해 하나씩 실행되는데

먼저 add의 콜백함수가 실행될 때는 _async_cb_receiver가 안걸려서 그냥 넘어갈 것이고,

그다음으로 sub의 콜백함수가 실행될 때, 아까 할당해놓았던 _async_cb_receiver가 걸려서 익명함수 function(arg) { args[i] = arg; wait(args)}가 result를 받아서 실행될텐데 책의 해설에서는 값을 치환하면서 재귀한다고 하셨는데요. args는 이 async_cb_receiver의 인자인 이 익명함수와 wait의 클로저가 참조하고 있는 sub의 args일 것이고 args[0]에 add의 리턴인 async_cb_receiver가 걸려서 _callback이 받은 result로 args[0]에 result를 할당하여 치환했고 다시 wait을 다시 실행하는데요.

왜 wait이 다시 재귀로 도는지 아무리 생각해도 이해가 안갑니다.

저 코드에서 wait(arg) 부분을 주석처리하고 익명함수에 func.apply(null, args)를 넣어도 에러없이 돌아갔는데요. sub가 _async_cb_receiver를 만났을때 값만 치환하고 func.apply()를 하면 됐지 다시 wait을 켜서 for문을 돌며 _async_cb_receiver를 확인하면서 기다려야되는 이유가 있나요?

질문이 두서없어서 죄송합니다. 저도 머릿속으로 최대한 상황들을 그려내려고하는데 지식이 부족해서 뭐가 어떻게 돌아가는지 정확히 모르겠네요..

혹시 비동기 상황에서 log, sub, div, add의 콜백들이 어떤순서로 실행되는지는 알수 없기때문에 wait()을 쓰며 결과를 받을때까지 계속 자기자신으로 재귀하는건가요?

더 생각해보다가 다시 궁금한 점이 생겼는데 wait함수를 실행할때마다 콘솔에 찍히게

 (function wait(args) {  
 console.log(args[0] + args[1] + " wait");  
 /* 새로운 공간 추가 */  
 for (var i = 0; i < args.length; i++)  
 if (args[i] && args[i].name == '_async_cb_receiver')  
 return args[i](function(arg) { args[i] = arg;  
 wait(args);  
 });  
 func.apply(null, args);  
 })(arguments);  

이런식으로 찍어봤는데요. 저는 wait()이 마구 재귀할줄알았는데 실행결과를 보니 사이사이에 한번씩만 찍혔습니다.
콜백함수에서 wait() 재귀함수를 호출할경우 바로 실행되서 결과받을때까지 도는게 아니라 콜백함수처럼 다시 백그라운드 갔다가 task queue로 가서 콜백함수처럼 실행되나요?
정확한 동작을 알고싶은데 제 검색능력이 딸려서 잘 못찾겠네요

1
박시중 박 프로필

import 시 구문.. 박시중 박 2달 전

npm i fxjs2 해서 설치는 했습니다만,

node js 나 vue 등에서 import, 또는 require 할때는 어떻게 해야 하나요?

import ??? from 'fxjs2' 에서 어떻게 해야 할지를 모르겠습니다.

2
노경욱 노 프로필

사용하시는 material theme 뭔가요?? 노경욱 노 3달 전

인텔리제이사의 Webstorm을 사용하신다고 알고 있습니다.

'( )'마다 색상이 다다른데 어떤 theme을 사용하는지 알고 싶어요~

1
노경욱 노 프로필

Text Editor 뭐 쓰시나요? 노경욱 노 4달 전

Text Editor 뭐 쓰시나요?

옆에 콘솔창이 나오는 에디터를 찾고 있습니다.

1