BEST

개발 · 프로그래밍

프로그래밍 언어

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

Name: 함수형 프로그래밍과 JavaScript ES6+ 응용편
Price: 44000 KRW

이 강좌는 함수형 프로그래밍과 JavaScript ES6+의 시리즈 강좌로 다양한 응용 사례를 다룹니다.

(4.9) 수강평 115개

수강생 3,306명

MDU 유인동

JavaScript 함수형 프로그래밍

중급자를 위해 준비한
[웹 개발, 프로그래밍 언어] 강의입니다.

이런 걸 배울 수 있어요

함수형 프로그래밍
이터러블 프로그래밍
동시성 프로그래밍
프론트엔드에서 함수형 프로그래밍 응용하기
백엔드에서 함수형 프로그래밍 응용하기

생산성을 높이는 함수형 코드 작성!
이터러블 프로그래밍을 응용해요 👊

무엇을 배우나요? 📖

자바스크립트는 ES6+가 되면서 언어에서 이터러블 프로토콜을 특별히 강조하고 있습니다. 이터러블 프로그래밍을 통해 명령형 코드를 대체합니다. 심볼/이터러블/이터레이터/제너레이터, Promise/async/await 등의 프로토콜이 강조되고 있습니다. 이후 버전에서도 async/await/for...await-of/Async Iterator 등으로 프로토콜이 발전하고 있습니다.

이 강의는 '함수형 프로그래밍과 JavaScript ES6+'의 후속 강의로 함수형 프로그래밍, 이터러블 프로그래밍을 다양하게 응용합니다. 이 강의를 들으면 에러가 나기 쉬운 i++, j++, if, for, break 등의 명령형 코드를 더이상 작성하지 않을 수 있습니다. 에러율이 적으며, 생산성이 높고, 아름다운 표현력을 가진 함수형 코드를 작성해보세요!

자바스크립트에서의 이터러블 프로그래밍의 장점 💡

언어 차원에서 지원하는 프로토콜을 통해 만들어지는 코드이기에 조합성이 높습니다.
언어 차원에서 지원하는 에러 핸들링을 사용할 수 있습니다.
비동기/동시성 프로그래밍을 보다 안전하고 쉽게 할 수 있습니다.
코드 양을 최소화할 수 있습니다(트랜스파일링을 하면서도 변환되는 코드의 양을 최소화할 수 있는 아이디어도 가지고 있습니다).

ES5 문법 프로그래밍의 불편함 🥲

i++, j++, if, for, break, 상태 변경에 의존한 코드는 버그가 생기기 쉽습니다.
기능 발전, 기획 변경에 대응하다보면 버그가 발생되기 쉬워 유지보수가 어렵습니다.
개발자마다 선호하는 코드 스타일이 다르고, 서로의 코드를 해석하기 어렵습니다.
항상 로직을 새로 작성해야하고, 그에 따른 테스트 케이스도 많아져 생산성이 떨어집니다.

지식공유자 한마디 😀

2008년도 쯤 부터 리습, 이터러블, 리액티브 등을 기반으로한 클로저, 엘릭서, 스칼라와 같은 다양한 함수형 언어들이 생겨나고, 다른 언어들에서는 많은 관련 라이브러리들이 생겨나더니, 최근에 이르러서는 현업에서 가장 많이 사용되는 자바, 스위프트, 코틀린, 자바스크립트 등에 람다가 적용되고, 스트림 혹은 이터러블이라는 이름으로 언어 자체에 LISP 혹은 FP가 도입되었습니다. 더 다양한 상황에서 함수형 프로그래밍이나 이터러블 프로그래밍이 필요하다는 인식이 퍼지고 있고, 이러한 기술들이 실무에서 자연스럽게 사용되고 있습니다.

함수형/이터러블 프로그래밍이 모든 언어에 적용되고 있는 것은 실제적인 가치 때문입니다. 이터러블 프로그래밍은 문제를 작게 만들고 조합성을 높이는데 좋은 도구입니다. 이제는 거의 대부분의 언어에 적용되면서 이 방법은 탈 언어적인 해결책이 되었습니다.

특히 자바스크립트는 이터러블/이터레이터/제너레이터/심볼 등을 기반으로 매우 뛰어난 프로토콜을 가지고 있습니다. 이러한 프로토콜은 개발자로 하여금 언어를 다루라고 이야기하고 있습니다. ES6+의 진짜 매력은 이 '이터러블 프로토콜'이라고 생각합니다. 이터러블 프로그래밍은 생산성을 높이고, 오류율을 줄이고, 유지보수가 용이한 코드를 작성할 수 있게 하는 아주 훌륭한 도구입니다.

예제 코드 📜

https://github.com/indongyoo/functional-javascript-02

이런 분들께
추천드려요!

학습 대상은
누구일까요?

함수형 프로그래밍을 배우고 싶은 분
이터러블 프로그래밍 응용법을 알고 싶은 분
함수형/이터러블/동시성 실제 사용 사례가 궁금한 분
간결하고 우아한 코드를 작성하고 싶은 분
JS 개발자로서 한 단계 도약하고 싶은 분

선수 지식,
필요할까요?

함수형 프로그래밍과 JavaScript ES6+ 인프런 강의
ES6+ 기본 문법
이터러블/이터레이터/제너레이터

안녕하세요
MDU 유인동입니다.

22,335

명

수강생

765

개

수강평

456

개

답변

4.9

점

강의 평점

개

강의

마플코퍼레이션 CTO
전 카카오, 엔씨소프트 오픈마루 스튜디오 개발자
마플개발대학 유튜브 채널, 온라인 커뮤니티
객체지향 FE 라이브러리 Rune 개발
함수형 라이브러리 FxTS 설계 참여
함수형 라이브러리 FxJS 개발
함수형 데이터베이스 쿼리 빌더 FxSQL 개발
함수형 DOM 조작 라이브러리 FxJS-DOM 개발
저서 함수형 자바스크립트 프로그래밍
함수형 자바스크립트 페이스북 그룹 운영
네이버, 넥슨, 카카오 개발자 대상 기술 교육, 기업 출강
다수의 온/오프라인 강의

커리큘럼

전체

48개 ∙ (6시간 2분)

섹션 1. 이터러블 프로그래밍 혹은 리스트 프로세싱 (L i s p)

10개 ∙ (44분)

1. 들어가며
03:54
2. 홀수 n개 더하기
02:46
3. if를 filter로
07:38
4. 값 변화 후 변수 할당을 map으로
01:07
5. break를 take로
00:52
6. 축약 및 합산을 reduce로
08:33
7. while을 range로
06:46
8. 효과를 each로 구분
02:04
9. 추억의 별 그리기
07:12
10. 추억의 구구단
03:20

섹션 2. 명령형 습관 지우기 - 만능 reduce? No!

5개 ∙ (35분)

11. reduce + 복잡한 함수 + acc 보다 map + 간단한 함수 + reduce
08:00
12. reduce 하나 보다 map + filter + reduce
04:49
13. query1, query2
08:15
14. query3, query4
09:26
15. queryToObject
05:17

섹션 3. 안전한 합성에 대해

2개 ∙ (12분)

16. map으로 합성하기
03:02
17. find 대신 L.filter 써보기
09:02

섹션 4. 객체를 이터러블 프로그래밍으로 다루기

10개 ∙ (57분)

섹션 5. 객체지향과 함께 사용하기 - 사용자 정의 객체를 이터러블 프로그래밍으로

3개 ∙ (32분)

섹션 6. 시간을 이터러블로 다루기

8개 ∙ (1시간 14분)

섹션 7. 프론트엔드에서 함수형/이터러블/동시성 프로그래밍

10개 ∙ (1시간 45분)

강의 게시일: 2019. 05. 11.

마지막 업데이트일: 2025. 05. 13.

수강평

전체

115개

4.9

115개의 수강평

hellofrontdev
수강평 4
∙
평균 평점 5.0
2020. 10. 27.
5
100% 수강 후 작성
"다음에 나올 강의 마저 기다려지는 최고의 강의" 처음 들을 때는 이게 뭘까? 어떻게 돌아가는거지? 라는 의문 한 가득이지만 코드 하나하나를 음미하다보면 자바스크립트 언어의 매력에 푹 빠지게 되고 짜임새있는 강의와 전달력에 흠뻑 빠지게 됩니다. 얼릉 강사님께서 여유가 생기셔서 다음 강좌를 만들어주시길 학수고대하고 있습니다. (다음에는 실제 프로젝트를 함께 만들어보는 강의가 추가되었으면 좋겠어요!)
- MDU 유인동
  지식공유자
  2020. 10. 27.
  너무 감사한 리뷰네요. 여유가 되었을때 꼭 준비하도록 하겠습니다 :)
girili60
수강평 5
∙
평균 평점 4.8
2021. 11. 26.
5
100% 수강 후 작성
정말 매력적인 함수형 프로그래밍..!! 정말 좋은 강의에요! 백번추천!
- MDU 유인동
  지식공유자
  2021. 11. 26.
  fxts 도 관심가져주세요!! :)
Kunho Lee
수강평 10
∙
평균 평점 4.2
2019. 11. 13.
5
100% 수강 후 작성
함수형 자바스크립트의 실제 적용 사례를 볼 수 있어서 좋았습니다. 실무에서 해결해야 할 법한 상황을 함수형 프로그래밍을 적용하여 보기 좋고 읽기 쉬운 코드로 해결해 나가는 걸 보니 함수형 프로그래밍을 더 구체적으로 느낄 수 있었습니다. 다음 강의에서는 특정 서비스, 어플리케이션을 함수형 프로그래밍을 적용하여 만들 때 어떻게 설계하고 의존성은 어떻게 관리하는 지 같은 내용을 가르쳐주시면 좋을 것 같습니다. 좋은 강의 감사합니다 :)
- MDU 유인동
  지식공유자
  2019. 11. 13.
  상세한 리뷰 감사해요. 열심히 만든 기쁨이 있네요! 좋은 후속 컨텐츠도 말씀주신대로 꼭 잘 만들어볼께요 :)
이성필
수강평 6
∙
평균 평점 5.0
2019. 08. 15.
5
100% 수강 후 작성
단숨에 끝까지 달려왔습니다. 정말 유익하고 재밌었습니다. 실무에 적용하기 위해 연습이 필요하겠지만, 처음 addMaker함수를 만들듯이 조금씩 적용해 나가면 되지 않을까 생각하고 있습니다. 감사합니다. 앞으로도 좋은 강의 부탁드립니다! 수고하셨습니다!
- MDU 유인동
  지식공유자
  2019. 08. 15.
  헛 단숨에! 재밌게 들으셨다니 감사합니다. 좋은 내용 전달할 수 있도록 하겠습니다. :>
iternity
수강평 2
∙
평균 평점 5.0
2019. 05. 23.
5
100% 수강 후 작성
이전강의를 듣고 배운 개념들을 적용해서 함수형 라이브러리를 이용하여 코딩해봤지만 보조함수가 길어지고 명령형 코드를 단순히 보조함수에 옮겨놓은게 아닌가.. 명령형코드가 go에 제어문을 때려박은 함수로 바뀌었을 뿐인듯한 느낌을 지울수가없었습니다. 이 강의를 듣고나서야 map, filter, reduce를 바라보는 다른 시점, 이터러블/이터레이터를 위의 함수로 감싸 모나드를 통한 안전한 함수합성, 재사용성이 높은 함수를 추출하여 추상화하여 계속 사용하는 테크닉 등 이전강의만 듣고 무작정 코딩에 달려들었을때 부족한 2%를 채워줄만한 강의였다고 생각합니다. 아직 이 강의를 완벽하게 소화한건 아니지만 몇번이고 반복해서 들으면서 공부하겠습니다. 좋은 강의 감사합니다.
- MDU 유인동
  지식공유자
  2019. 05. 23.
  전달하고 싶었던 내용들을 많이 짚어주셨네요. :) 고맙습니다. 화이팅!

MDU 유인동님의 다른 강의

지식공유자님의 다른 강의를 만나보세요!

멀티패러다임 프로그래밍 1편: 반복자 패턴 & LISP (with TypeScript, Clojure, Kotlin)

MDU 유인동

중고급 개발자로 성장하기 위한 고급 프로그래밍 언어 활용 능력과, 함수형, 객체 지향, LISP 패러다임이 결합된 소프트웨어 설계 및 구현 능력을 기릅니다.

중급이상

멀티 패러다임 프로그래밍, TypeScript, 함수형 프로그래밍

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

MDU 유인동

ES6+와 함수형 프로그래밍을 배울 수 있는 강의입니다. 이 강좌에서는 ES6+의 이터러블/이터레이터/제너레이터 프로토콜을 상세히 다루고 응용합니다. 이터러블을 기반으로한 함수형 프로그래밍, map/filter/reduce, 파이프라인, 제너레이터를 통한 지연 평가, Promise 합성, 동시성/병렬성, async/await와 비동기 에러 핸들링 등을 배울 수 있습니다. 이 강좌를 습득하고 연습하여 중급 자바스크립트 개발자로 성장하세요!

초급

JavaScript, 함수형 프로그래밍

자바스크립트로 알아보는 함수형 프로그래밍 (ES5)

MDU 유인동

마플(http://www.marpple.com)의 CTO 유인동님이 알려주는 함수형 프로그래밍에 대한 강좌 입니다. 함수형 프로그래밍으로 라이브러리를 직접 만들어가며 함수형 프로그래밍의 패러다임과 코딩의 즐거움을 느낄 수 있습니다.

초급

JavaScript, 함수형 프로그래밍

비슷한 강의

같은 분야의 다른 강의를 만나보세요!

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

MDU 유인동

초급

JavaScript, 함수형 프로그래밍

Swift로 함수형 프로그래밍 시작하기

송치원

이 강의는 함수형 프로그래밍이 처음인 개발자들을 대상으로, 기존의 사고 체계를 조금씩 바꿔나가는 데에 도움을 드리고자 이론과 실습으로 구성한 강의입니다.

중급이상

iOS, Swift, 함수형 프로그래밍

시나브로 자바스크립트

이은재

자바스크립트로 다양한 주제를 바닥부터 개발해 보며 튼튼한 실력의 기반과 자신감을 쌓아보세요.

중급이상

JavaScript, vanilla-js

TS/JS 디자인 패턴 with Canvas: 제로초에게 제대로 배우기

제로초(조현영)

타입스크립트/자바스크립트로 그림판을 만들어보며 다양한 디자인 패턴의 쓰임과 장단점을 알아봅니다. canvas api를 배울 수 있는 것은 보너스!

중급이상

디자인 패턴, 객체지향, TypeScript

웹 퍼블리싱 마스터 하기 - figma to web with javascript

이지웹

이 강의는 Figma 디자인을 웹 페이지로 구현하는 과정에 대해 단계별로 설명합니다. 이미지 저장부터 HTML, CSS 작성, Javascript 작성까지 전반적인 웹 퍼블리싱 실무를 다룹니다. 초보자도 쉽게 따라 할 수 있도록 체계적으로 진행됩니다. 실습 위주의 학습을 통해 웹 디자인을 효율적으로 코드로 변환하는 방법을 배울 수 있습니다.

초급

HTML/CSS, JavaScript, Figma

자바스크립트 Class로 떠나는 여행

The Oreum

자바스크립트는 Class를 왜 사용할까? Class가 등장하기 이전에는 어떻게 객체지향프로그래밍을 구현했을까? 자바스크립트를 공부하다보면 한번쯤 가져볼만한 문제에 대한 해답을 찾아 가벼운 여행을 떠나봅니다.

초급

JavaScript, 객체지향, frontend

조코딩의 코딩 기초와 웹 풀스택 개발

조코딩

코딩 1위 유튜버 조코딩의 실전 압축! 쉽고 재미있는 웹 풀스택 개발 강의

입문

HTML/CSS, JavaScript, Node.js

웹게임을 만들며 배우는 인터렉티브웹! JAVASCRIPT

깡코딩

웹게임도 만들고, 프론트엔드 웹 개발 스킬도 배우는 1석 3조 수업! 독자적인 아이디어로 JavaScript, CSS, HTML을 활용해 게임을 만들 수 있는 방법을 수업으로 만들었습니다!

초급

인터랙티브 웹, JavaScript, HTML/CSS

리액트 공식문서 함께 공부하기

정재남

2023년 리뉴얼된 React 공식 문서를 함께 학습해요.

입문

React, JavaScript, react.js

자바스크립트 머신러닝 TensorFlow.js

김영보

자바스크립트 환경에서 머신러닝 개념을 다룹니다. 자바스크립트와 TensorFlow.js로 머신러닝을 구현하는 형태와 코드를 다룹니다.

중급이상

Tensorflow, JavaScript, 머신러닝

[2025] 비전공자도 가능한 React Native 앱 개발 마스터클래스

정현우

아이디어는 있는데 앱을 어떻게 개발해야할지 몰랐던 분들, 실전 프로젝트 4개를 만들어보면서 앱 개발을 마스터해봅시다!

입문

JavaScript, React, Node.js

게임으로 배우는 JavaScript

노마드크리에이터

게임프로그램을 직접 만들어보면서 자바스크립트의 기본과 실전능력을 키우는 강의입니다.

입문

JavaScript

Do it! HTML+CSS+자바스크립트 웹 표준의 정석

이지스퍼블리싱

키보드를 잡고 실습하다 보면 웹 개발의 3대 기술이 끝난다!

입문

HTML/CSS, JavaScript, DOM

JavaScript 알고리즘 베스트 10

The Oreum

가장 많이 출제되는 유형을 담은 'JavaScript 알고리즘 베스트 10'을 통해 문제의 핵심을 찾아 풀이하는 능력을 키워보세요!

중급이상

JavaScript, 코딩 테스트, 알고리즘

이거 하나로 종결 - 32시간 고품질 스프링 풀스택 웹개발

그린코딩

그냥 들어보세요. 강의력과 흡입력 그리고 강의의 질이 다릅니다.

입문

HTML/CSS, JavaScript, Spring Boot

모바일, 태블릿, pc 반응형 인스타그램 클론코딩

더코딩클럽

이 강의를 통해 수강생은 HTML, CSS, JS로 인스타그램과 비슷한 웹서비스를 만들 수있습니다. ( 프론트만 구현했습니다! 백엔드 서버 구축은 차후 강의 촬영 예정입니다.)

초급

HTML/CSS, JavaScript, 클론코딩

Node.js로 웹 크롤링하기

제로초(조현영)

네이버, 아마존, 트위터, 유튜브, 페이스북, 인스타그램, unsplash.com 등의 사이트를 크롤링하며 실전에 적용해봅니다.

중급이상

JavaScript, Node.js, 웹 크롤링

[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스

코드캠프

코딩과 사랑에 빠져버린 8년차 풀스택 개발자 Captain의 사심이 가득 담긴 커리큘럼이에요. 백엔드의 모든 것을 다 알려주고 싶은 Captain의 마음이 녹아있죠! 이 강의를 듣다보면 '이렇게까지 알려준다고?' 하는 생각을 떨칠 수 없을 거예요. 모두가 어려워하는 부분까지 꼭꼭 씹어 떠먹여주는 이 강의로 시작해 볼까요?

입문

NestJS, Node.js, JavaScript

클린업 JavaScript: 베이스 빌드업!

김영보

생각을 다룹니다. 자바스크립트 핵심과 근본을 논리적으로 정리할 수 있습니다. 자바스크립트 경험, 생각을 스스로 정리할 수 있습니다. 자바스크립트 기술 논리를 정립할 수 있습니다. 자바스크립트 전체를 보는 시야를 넓힐 수 있습니다. 자바스크립트 기술 면접 문제에 대비할 수 있습니다.

초급

JavaScript, 면접, 기술면접