함수형 프로그래밍과 JavaScript ES6+대시보드

객체에는 Symbol.iterator가 정의 되어 있지 않은데 어떻게 전개 연산을 할 수 있는건지 궁금합니다!    또 전개연산과 더불어 Symbol.iterator가 정의 되어 있어야지만 구조분해할당 도 가능 한건가요?? 

const total_quantity = products => go(products, map(~),reduce(~) 에서   () => go() 함수는 pipe()로 대체 가능하다.   즉, pipe의 용도가 go() 함수를 리턴하는 경우 pipe가 함수를 리턴하는 함수임으로 간결하게 표현하기 위하여 사용하는 것인가요?

1. products => filter(p => p.price < 20000)(products) 1단계: 변형 2. products ⇒ filter(p ⇒ p.price < 20000) 인자 하나만 들어 왔다. 2단계: 부분 해석  따라서 (...) => f(a, ...) 함수를 리턴한다. (...) => f(a, ...) (products) 와 같다.   로 이해했는데 맞나요?

const reduceFunc = (f, acc, iter) => {     if (!iter) {         iter = acc[Symbol.iterator]();         acc = iter.next().value;     }     return go1(acc, function recur(acc) {         for (const a of iter) {             acc = f(acc, a);             if (acc instanceof Promise) {                 return acc.then(recur);             }         }         return acc;     }); };   acc.then(recur)를 하면 재귀한 값(프로미스)가 리턴이 되면서 실행 컨택스트가 종료되고 go1함수가 바로 리턴이 되는걸로 보이는데, 실행해보면 또 그렇지 않네요,,, 리턴을 해도 내부에 실행 로직이 돌고있나요?  

22강 5:30~6:30  1분동안 설명하신 부분중에서, curry가 인자가 1개만 들어오면, 인자를 더 받을 수 있는 함수를 return 하는것 까지는 잘 이해가 됬는데,  왜 go 안의 filter,map,recduce부분의 products를 다 줄일 수 있게 되는건가요 ?  사실 설명이 재귀적으로 되어 있어서 잘 이해가 안되는데 풀어서 설명해주실 수 있을까요 ! 

말그대로 Array.prototype.map()를 실무에서 저런 방법으로 대체해서 사용하기도 하나요?

후반부에서 getUserById함수에서 find한 값 없을 경우를 함수 내부에서 처리를 했는데 이런 경우 순수함수라고 할 수 있나요??그리고 상황에 따라 다르겠지만 지금처럼 Promise.reject을 함수 안에서 다 만들어서 에러가 나도록 코드를 작성하는 것이 좋을까요?답변 주시면 감사하겠습니다ㅎㅎ 강의 너무 잘 보고 있습니다. 감사합니다 :)

안녕하세요 유익한 강의 감사합니다! 실무에서 사용하고싶은데 막상 사용하려니 어떤식으로 사용해야할지 모르겠어서 질문 남깁니다! 실무에서 강의에서 배운 내용들을 사용한다고 하였을때미리 헬퍼함수로 L.map, L.filter curry, go, pipe 등 모아놓는 파일을 모듈로 분리하여 임포트해서 사용하는 방식으로 해야하는건가요?? 그리고 기존 어레이 프로토타입에 내장된 map, filter, reduce등을 사용하지않고 강의에서 사용된 새로운 map, filter, reduce를 정의해서 사용해야 하는것이구요  기존 js 내장함수들(map, filter, reduce)등을 사용하지 않고 같은 이름으로 재정의해서 사용하는 것이다보니 헷갈립니다실무에서는 어떻게 사용되는지 조금 힌트를 얻을수 있을까요!?

함수형 프로그래밍에서는 순수함수로 만들어야된다 라고 알고있는데 랜덤숫자뽑는 로직을 만들어야된다고한다면 동일한입력 동일한출력이 나올수가 없을거같은데 이런경우에는 순수함수가 될수가 없는게 맞는걸까요?

화살표 함수내 화살표 함수에서 외부에 선언된 변수의 값이 중간의 화살표 함수내에서는 정상적으로 배열로 리턴되는데 중간 화살표 함수를 벗어나서 로그를 남기면 배열로 남지 않습니다.   import Excel from 'exceljs' const ReadExcelSheet = async excelFile => { const wb = new Excel.Workbook() const reader = new FileReader()   let excelDataList = [] reader.readAsArrayBuffer(excelFile) reader.onload = () => { const buffer = reader.result wb.xlsx.load(buffer).then(workbook => { const sheet = workbook.getWorksheet(1)   let row_num = 13 sheet.eachRow((row, rowIndex) => { let resultData = {} resultData.title = row.getCell(3).text excelDataList.push(resultData) })                       console.log(excelDataList) // 여기서는 정상적으로 배열로 응답됨.               }) }  console.log(excelDataList) // 여기서는 배열로 응답되지 않음. return excelDataList } 아무리 해도 원인을 찾지 못해 문의를 드립니다.   감사합니다.

안녕하세요. 좋은 강의 항상 잘 듣고 있습니다.   함수형 프로그래밍에 익숙하지 않는 상태로 여기까지 듣고 의문점이 하나 생겨서 질문 남깁니다.   지금까지의 강의 내용으로 보면 효율성등에서 항상 느긋한 계산 좋아보이는데 굳이 map과 filter등을 구현하는데 있어 'L.'을 붙여 굳이 메소드를 나눈 이유는 무엇인가요?   엄격한 계산과 느긋한 계산이 각각 트레이드오프를 가지고 있으며 경우에 따라 선택해서 써야하는 것인가요?   아니면 느긋한 계산이 좋다는 것을 보여주기 위한 비교를 위해 엄격한 계산도 보여주는 것인가요?

. 안녕하세요 다름이 아니라 예제파일을 다운받아서 강의를 보면서 같이 진행을 하고있는데요, 예제 파일이 정상적으로 로그창에 출력이 안되는데.. 혹시 이유가 뭔지 알수있을까요?   비주얼 스튜디오 코드를 사용하고있습니다!

안녕하세요! 다름이 아니라 제네레이터 함수가 작동하지 않아서 질문드립니다..! 강의를 보면 선생님같은경우는 함수명앞에 * 별표가 잘 붙어있는데 저같은경우는 보면 * 별표가 function 옆으로 붙어버립니다. 함수명 옆에 별표를 붙여도 저장누르는 순간 펑션옆으로 별이 이동합니다.. 그리고, 콘솔로그도 나오질 않습니다. 아마 제네레이터 함수가 정상적으로 작동되질 않는것같은데, 이유가 뭔지 알수있을까요?

강의에서는 2개의 케이스를 작성해서 일반 함수 / 제네레이터 함수 에 대해서 언급을 해주시면서 화면상에는 성능이 약 1.8 배 정도 난 걸로 보았습니다. 정말 그렇게 큰 차이가 나는가 라는 생각을 해서 다음과 같은 케이스를 검증해보았습니다.   # 케이스 1. new Array() > push()2. new Array(length); > array[index] = i3.  Array.from({ length: l }, ( _, i ) => i);4. 강의에 나온 제네레이터 함수   # 결과  빠르네요!! ## 10_000 기준 (8.87% 빠름) ## 100_000 기준  (0.2396% 느림) ## 1_000_000 기준 (8.8299..% 빠름) ## 10_000_000 기준 (11.42% 빠름) ## 코드 const range1 = l => { let i = -1; let res = []; while (++i < l) { res.push(i); } return res; }; const range2 = l => { let i = -1; let res = new Array(l); while (++i < l) { res[i - 1] = i; } return res; }; const range3 = l => Array.from({ length: l }, (_, i) => ++i); const L = {}; L.range = function *(l) { let i = -1; while (++i < l) { yield i; } } function test(name, time, f) { console.time(name); while(time--) f(); console.timeEnd(name); } test('push', 10, () => customReduce(add, range1(1_000_000))); test('index', 10, () => customReduce(add, range2(1_000_000))); test('Array.from', 10, () => customReduce(add, range3(1_000_000))); test('Generator', 10, () => customReduce(add, L.range(1_000_000)));

너무나 좋은 강의로 함수형 프로그래밍 에 대해서 조금씩 감을 잡아 나가는 방향입니다. 함수의 비즈니스 로직을 숨기고 함수의 표현식들을 드러내서 이 과정에 사이드 이펙트를 없애고 직관적으로 읽기 좋은 형태 를 지니게 되는 것 같습니다. 다만, OOP 에서의 메서드 와의 다른 점으로는 내외부 함수의 교류가 없다 정도인 것 같습니다.   다만 여기까지가 주요한 맥락이라면 아래 코드가 결국은... const sum = (func, iter) => go( iter, map(func), reduce(add) ); 이러한 코드 와의 별다른 차별점은 없는 것으로 해석되지 않을까요? const sum = (func, iter) => iter.map(func).reduce(add); 이렇게 이해 하였는데 맞는 것일까요?

안녕하세요! 강의 너무 재미있게 잘 듣고 있습니다. 소개해주신 FxSQL에 흥미가 생겨서 FxTS하고 같이 사용해보려고 했는데, FxSQL은 아직 타입스크립트를 지원하지 않는 것 같더라고요... 혹시 마플에서는 FxTS로 프로젝트 진행할때 어떤 쿼리빌더나 ORM을 쓰는지 알 수 있을까요?

안녕하세요, 강의를 들으면서 코드 작성하는 도중 에러가 발생하여, 찾아보다 잘 모르겠어서 질문드리게 되었습니다. 코드 질문을 이렇게 드려도 되는지 모르겠습니다. 수정해서 질문을 올려야할 부분이 있다면, 말씀주시는대로 수정하여 질문을 다시 작성하겠습니다.   감사합니다! L.flatMap = curry(pipe(L.map, L.flatten)); let iter = L.flatMap( (a) => a, [ [1, 2], [3, 4], [5, 6, 7], ] ); console.log(iter.next()); // error L.flatten에서 iter is not iterable // L.map 에서 제대로 실행이 안된다고 판단 // iter 변수의 값을 펼쳐서 생각해봄 /** * L.flatMap( (a) => a, [ [1, 2], [3, 4], [5, 6, 7], ] ); 함수는 아래와 같다. curry( pipe( L.map, L.flatten ) )( (a) => a, [ [1, 2], [3, 4], [5, 6, 7], ] ) ) --- curry 함수는 const curry = (f) => (fn, ...iter) => iter.length ? f(fn, ...iter) : (...args) => f(fn, ...args); 이기 때문에, 위 코드는 아래와 같다. pipe( L.map, L.flatten ) )( (a) => a, [ [1, 2], [3, 4], [5, 6, 7], ] ) --- pipe 함수는 const pipe = (...fn) => (args) => go(args, ...fn); 이기 때문에, 위 코드는 아래와 같다. go( ( (a) => a, [ [1, 2], [3, 4], [5, 6, 7], ] ), L.map, L.flatten ) --- go 함수는 const go = (...args) => reduce((a, f) => f(a), args); 이기 때문에, 위 코드는 아래와 같다. reduce((a,f) => f(a), ( (a) => a, [ [1, 2], [3, 4], [5, 6, 7], ] ), L.map, L.flatten ) --- reduce 함수는 const reduce = curry((f, acc, iter) => { if (!iter) { iter = acc[Symbol.iterator](); acc = iter.next().value; } for (const a of iter) { acc = f(acc, a); } return acc; }); 이므로, acc은 ( (a) => a, [ [1, 2], [3, 4], [5, 6, 7], ] ) 이며, iter 는 [ L.map , L.flatten ] 이다. 여기서 제가 생각한 문제는 L.map에서 f로는 a => a , iter = [ [1, 2], [3, 4], [5, 6, 7], ] 를 받아서 iter를 그대로 반환해야 한다고 생각합니다. 하지만, L.flatten에서 받아온 iter는 iterable이 아니라고 에러 반환을 하는데, 문제가 무엇인지 모르겠습니다..     */

안녕하세요! 강의 잘 보고있습니다. 우선, 질 좋은 강의를 제공해주셔서 감사합니다.   지연성 강의 들어가기 이전, map,filter,reduce에 대해 서 기존 array에 존재하는 메서드들을 iterator에 적용할수있는 함수로 새롭게 만들어 주셨는데,   새로운 함수를 만들어서 사용하는 이유가 array가 아닌 iterator 객체들도 사용할 수 있게 하기 위함일까요? 그게 아니라면, 지연성에 들어가기 위한 빌드업 과정이라고 생각해야할까요??   감사합니다!

     저는 이상하게 결과가 range가 더 빠르게 나타나고 있어서, 혹시 제가 어느 부분을 잘못 작성한 것인지가 궁금해서 질문 남기게 되었습니다.  (저의 경우에는 range 든 L.range 든 먼저 test를 먼저 실행하는 쪽이 소요시간이 적게 나옵니다 ㅜ) (혹시 cpu의 차이가 있을까요? 위 테스트를 진행한 컴퓨터는 amd 입니다. 혹시나해서 인텔 컴퓨터로 테스트 했을 때는 L.range가 위치에 상관없이 적은 시간을 소요합니다!)

안녕하세요, 강의 잘 보고 있습니다. 함수형 프로그래밍을 사용하는 이유 중 하나가 조합성이 뛰어나다는 점으로 이해하고있는데요,   조합성이 뛰어나다는 것은, 기존 map,filter,reduce,join과 같은 arr의 메서드들은 arr에 국한되지만,   유인동 개발자님께서 보여주신 코드처럼 함수형 프로그래밍은 이터러블이 사용할 수 있는 함수들을 구현해주었기 때문에 조합성이 좋고 확장성이 좋다고 할 수 있는 건가요?   때문에, 이터레이터를 사용하여야 함수형 프로그래밍이라고 할 수 있는 걸까요?   감사합니다!