Published on2026년 2월 16일모나드(Monad)란 무엇인가 — Functor, Applicative, Monad를 JS로 이해하기javascriptfunctional-programmingmonadfunctorapplicativecategory-theory모나드는 함수형 프로그래밍에서 효과를 포함한 계산을 합성하기 위한 규약이다. 위키피디아 정의를 바탕으로 Functor→Applicative→Monad 계층과 모나드 법칙을 정리하고, JavaScript에서 Array/Promise/Maybe/Either로 어떤 의미를 가지는지 이론적으로 설명한다.Read more →
Published on2026년 2월 15일go, pipe, reduce에서 비동기 제어 — Promise를 값으로 다루는 함수 합성javascriptfunctional-programmingpromiseasyncreducegopipego, pipe는 reduce로 구현되어 있다. reduce 하나만 고치면 비동기 상황에서도 함수 합성이 안전하게 동작한다. 유명 함수와 재귀로 동기 구간의 성능을 지키면서, Promise.reject까지 안전하게 처리하는 방법을 알아보자.Read more →
Published on2026년 2월 15일비동기를 값으로 만드는 Promise — 모나드와 Kleisli Compositionjavascriptfunctional-programmingpromiseasynckleisli-compositionmonadcallback은 결과를 값으로 돌려주지 못한다. Promise는 비동기를 일급 값으로 만들어 합성을 가능하게 한다. 모나드 관점에서 Promise의 안전한 합성을 이해하고, Kleisli Composition으로 외부 상태 변화까지 다뤄보자.Read more →
Published on2026년 2월 14일flat 함수를 이터러블로 구현해보자. L.flatten과 L.deepFlat 🪆javascriptfunctional-programminglazy-evaluationiterableflatten중첩 배열을 펼치는 flat 함수를 이터러블로 구현해보자. 그리고 깊은 중첩까지 재귀적으로 펼치는 L.deepFlat을 구현해보자. 그리고 yield * 위임 문법을 알아보자.Read more →
Published on2026년 2월 9일게으른 함수로 부지런한 함수 만들기 🐢javascriptfunctional-programminglazy-evaluationiterablecomposition지연 평가 함수들이 단순한 성능 최적화 용도로만 생각하지 말자. 지연평가 함수는 즉시 평가 함수를 만드는 재료가 될 수 있다. L.entries, join, takeAll을 구현하고, L.map과 L.filter로 map과 filter를 재구성해보자. Read more →
Published on2026년 2월 8일이제는 타입스크립트로 구현해보자 😭javascripttypescriptfunctional-programmingtype-systemoverloading자바스크립트로만 작성했으니, 이제는 타입스크립트로 함수형 프로그래밍 유틸리티를 구현해보자. 가볍게 시작했는데 가볍게 끝나지 않았다.....Read more →
Published on2026년 2월 7일이번에는 지연 평가(feat: 제너레이터) 😎javascriptfunctional-programmingdebugginglazy-evaluationgenerator이번에는 조합된 지연 평가 함수들을 디버깅해보자. go, L.map, L.filter, take가 조합된 코드를 한 줄 한 줄 따라가며 지연 평가의 실행 흐름을 추적해보자.Read more →
Published on2026년 2월 6일조합된 즉시 평가 함수들을 자세히 디버깅해보자javascriptfunctional-programmingdebuggingeager-evaluationgo, map, filter, take가 조합된 코드를 한 줄 한 줄 따라가며 즉시 평가의 실행 흐름을 추적해보자.Read more →
Published on2026년 2월 3일필요할 때, 딱 그만큼만 - L.map과 L.filterjavascriptfunctional-programminggeneratorlazy-evaluationiteratormap과 filter의 지연 평가 버전인 L.map과 L.filter를 구현하고, 기존 함수와의 차이를 실행 흐름으로 비교해보자. 언제나 미리 다 계산하는 것보다, 필요할 때 딱 그만큼만 계산하는 게 효율적일 때가 있다.Read more →
Published on2026년 2월 1일나는 가끔 기다리고 싶을 때가 있다. (feat. 지연평가)javascriptfunctional-programminggeneratorlazy-evaluationperformance배열을 즉시 생성하는 range와 제너레이터를 활용한 지연 평가 함수 L.range를 구현하고 그 차이를 알아보면서 지연평가가 효율적인 경우에 대해서 생각해보자. 그리고 take 함수를 구현해서 지연평가에 적용해보자Read more →
Published on2026년 2월 1일맛있는 코드를 위한 레시피, Curry 🍛javascriptfunctional-programmingcurryrefactoring매일 쓰는 함수에 Curry를 곁들이면? 부분 적용부터 가독성 향상까지, 코드를 더 맛있게(깔끔하게) 만들어주는 Curry 함수에 대해 알아보자.Read more →
Published on2026년 1월 31일디버거로 reduce, go, pipe를 까보자javascriptfunctional-programmingreducedebuggingpipego여러 함수를 순차적으로 실행하여 새로운 합성(?) 함수를 만드는 pipe를 만들어보자. 그리고 사용하면서 어떻게 작동하는지 자세하게 살펴보자Read more →
Published on2026년 1월 30일파라미터? 제가 알아서 처리할게요javascriptfunctional-programmingargumentsrest-parameterargs, arguments에 대해서 알아보고, 함수에서 가변 인자를 다루는 방법을 알아보자. 그리고 가변인자를 다루는 go라는 함수를 만들어보자Read more →
Published on2026년 1월 28일reduce로 데이터를 하나로 모으는 마법javascriptiteratoriterablefunctional-programmingreducepolymorphismIterable 프로토콜을 활용하여 배열뿐만 아니라 Generator, Map, Set 등 다양한 데이터 구조를 하나의 값으로 축약하는 reduce 함수를 직접 만들어보자Read more →
Published on2026년 1월 27일이번에는 filter 차례다!javascriptiteratoriterablefunctional-programmingfilterpolymorphism이번에는 filter 함수를 직접 구현해보자. Iterable 프로토콜을 활용하여 배열뿐만 아니라 Generator, Set, 문자열 등 다양한 데이터 구조에 사용할 수 있는 filter 함수를 만들어보자Read more →
Published on2026년 1월 22일Iterable 프로토콜을 따르는 map 함수를 직접 만들면 뭐가 좋을까?javascriptiteratoriterablefunctional-programmingmapIterable 프로토콜을 활용하여 배열뿐만 아니라 Generator, Map 객체 등 다양한 데이터 구조를 변환하는 map 함수를 직접 만들어보자Read more →
Published on2026년 1월 19일Generator로 Iterator 더 쉽게 만들기javascriptiteratoriterablegeneratorGenerator 함수를 사용하여 Iterator를 더 간결하게 구현하는 방법을 알아보자Read more →
Published on2026년 1월 18일JavaScript Iterable과 Iterator 이해하기javascriptiteratoriterableJavaScript의 Iterable과 Iterator 프로토콜을 이해하고, 커스텀 Iterator를 만들어보자Read more →
Published on2025년 11월 22일[Part2] Web Audio API와 AudioContext 시작하기webaudioAudioContextWeb-Audio-APItypescriptMediaStream을 획득했다면 이제 본격적으로 오디오를 처리할 차례다. Web Audio API의 핵심인 AudioContext를 이해하고, 마이크 입력을 오디오 그래프에 연결하는 방법을 알아보자.Read more →
Published on2025년 11월 17일[Part1] 브라우저에서 마이크 권한 얻기: getUserMedia()webaudiogetUserMediaMediaDevicesjavascripttypescript웹 브라우저에서 오디오를 녹음하려면 먼저 사용자의 마이크 접근 권한을 얻어야 한다. `getUserMedia`를 호출하면 그냥 되는거 아니냐 라고 쉽게 말할 수 있다. 하지만 이게 은근히 알아둬야 할 내용이 많이 있다.Read more →