Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Functional Programming Applied in JS
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
Tak Yanagida
December 22, 2013
Programming
0
110
Functional Programming Applied in JS
「JSで実際に役立った関数型プログラミング」
jsCafe #17で発表しました。
関数型プログラミングの考え方を使うことで、JavaScriptのコードがすっきり書けた事例を紹介。
Tak Yanagida
December 22, 2013
Tweet
Share
More Decks by Tak Yanagida
See All by Tak Yanagida
Non-mercator Projection with Mapnik
tyanagida
1
1.2k
How much we have to study English?
tyanagida
0
120
Brief Introduction of jQuery Mobile
tyanagida
0
130
PowerShell for LL Users
tyanagida
0
1.2k
Other Decks in Programming
See All in Programming
AI巻き込み型コードレビューのススメ
nealle
1
160
カスタマーサクセス業務を変革したヘルススコアの実現と学び
_hummer0724
0
690
OCaml 5でモダンな並列プログラミングを Enjoyしよう!
haochenx
0
140
Lambda のコードストレージ容量に気をつけましょう
tattwan718
0
120
izumin5210のプロポーザルのネタ探し #tskaigi_msup
izumin5210
1
110
疑似コードによるプロンプト記述、どのくらい正確に実行される?
kokuyouwind
0
380
AIと一緒にレガシーに向き合ってみた
nyafunta9858
0
220
16年目のピクシブ百科事典を支える最新の技術基盤 / The Modern Tech Stack Powering Pixiv Encyclopedia in its 16th Year
ahuglajbclajep
5
1k
今から始めるClaude Code超入門
448jp
8
8.6k
コントリビューターによるDenoのすゝめ / Deno Recommendations by a Contributor
petamoriken
0
200
今こそ知るべき耐量子計算機暗号(PQC)入門 / PQC: What You Need to Know Now
mackey0225
3
370
dchart: charts from deck markup
ajstarks
3
990
Featured
See All Featured
Docker and Python
trallard
47
3.7k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
25
1.7k
Claude Code のすすめ
schroneko
67
210k
コードの90%をAIが書く世界で何が待っているのか / What awaits us in a world where 90% of the code is written by AI
rkaga
60
42k
Designing for humans not robots
tammielis
254
26k
Avoiding the “Bad Training, Faster” Trap in the Age of AI
tmiket
0
75
Embracing the Ebb and Flow
colly
88
5k
The SEO identity crisis: Don't let AI make you average
varn
0
99
Fireside Chat
paigeccino
41
3.8k
Jamie Indigo - Trashchat’s Guide to Black Boxes: Technical SEO Tactics for LLMs
techseoconnect
PRO
0
57
The Pragmatic Product Professional
lauravandoore
37
7.1k
Prompt Engineering for Job Search
mfonobong
0
160
Transcript
JSで実際に役立った 関数型プログラミング 柳田 @tyanagida
ダムの地図公開してます http://maps.ontarget.cc/dams/
ダムの地図公開してます http://maps.ontarget.cc/dams/
自己紹介補足
自己紹介補足 • 古めのエンジニア コンピュータ歴約30年 Linuxは0.99から
自己紹介補足 • 古めのエンジニア コンピュータ歴約30年 Linuxは0.99から • 実はデューク大学のMBA
自己紹介補足 • 古めのエンジニア コンピュータ歴約30年 Linuxは0.99から • 実はデューク大学のMBA ティム・クックと一緒
自己紹介補足 • 古めのエンジニア コンピュータ歴約30年 Linuxは0.99から • 実はデューク大学のMBA •
ITエンジニアのための英語読解講 座はじめました ティム・クックと一緒
自己紹介補足 • 古めのエンジニア コンピュータ歴約30年 Linuxは0.99から • 実はデューク大学のMBA •
ITエンジニアのための英語読解講 座はじめました ティム・クックと一緒 英語ドキュメントの分からない 箇所があったら解説します http://d.hatena.ne.jp/casualstartup/20131117/it_english_grammar
関数って何?
関数って何? 関数=函数
関数って何? 関数=函数 大昔の教科書表記
関数って何? 関数=函数 f a b ・・・ 大昔の教科書表記 y
関数って何? 関数=函数 f a b ・・・ 大昔の教科書表記 y 値を入力したら、値が返ってくる (副作用はなし)
例題: FizzBuzz
例題: FizzBuzz 1. 1~100まで順に表示する 2. ただし、 1. 3の倍数のときには代わりにFizzと表示 2. 5の倍数のときには代わりにBuzzと表示
3. 15の倍数のときには代わりにFizzBuzzと表示
例題: FizzBuzz 1. 1~100まで順に表示する 2. ただし、 1. 3の倍数のときには代わりにFizzと表示 2. 5の倍数のときには代わりにBuzzと表示
3. 15の倍数のときには代わりにFizzBuzzと表示 まずfor (i = 1; i <= 100; i++)
例題: FizzBuzz 1. 1~100まで順に表示する 2. ただし、 1. 3の倍数のときには代わりにFizzと表示 2. 5の倍数のときには代わりにBuzzと表示
3. 15の倍数のときには代わりにFizzBuzzと表示 まずfor (i = 1; i <= 100; i++) これは手続き脳
関数脳の場合
関数脳の場合 1 ・・・ 2 3 100
f f f f 関数脳の場合 1 ・・・ 2 3 100
f f f f 関数脳の場合 1 ・・・ 2 3 100
1 2 Fizz Buzz
f f f f 関数脳の場合 1 ・・・ 2 3 100
1 2 Fizz Buzz ・fは、数字を1つ受け取って、FizzやBuzzを返す関数
f f f f 関数脳の場合 1 ・・・ 2 3 100
1 2 Fizz Buzz ・fは、数字を1つ受け取って、FizzやBuzzを返す関数 ・配列の各要素に、関数を適用する操作が”map”
JavaScriptで書く var f = function (x) { if (x %
15 === 0) return 'FizzBuzz'; if (x % 5 === 0) return 'Buzz'; if (x % 3 === 0 ) return 'Fizz'; return x; } [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15].map(f);
JavaScriptで書く var f = function (x) { if (x %
15 === 0) return 'FizzBuzz'; if (x % 5 === 0) return 'Buzz'; if (x % 3 === 0 ) return 'Fizz'; return x; } [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15].map(f); ECMA Script 5.1以降
ダムの地図で使った場所: フィルタの処理
ダムの地図で使った場所: フィルタの処理 • if文が結構ややこしい • フィルタ条件は増減あるかも • ダムの分類も変わるかも • 画面内のダムだけ対象か、全ダ
ム対象か、決めてない
ダムの地図で使った場所: フィルタの処理 • if文が結構ややこしい • フィルタ条件は増減あるかも • ダムの分類も変わるかも • 画面内のダムだけ対象か、全ダ
ム対象か、決めてない Mapっぽく書いたらすっきり!!
ついでにreduceはこんな感じ * この操作をfoldと呼ぶ言語もある f f f a1 ・・・ a2 a3
an ・・・ y a4 f
言いたかったこと 関数型プログラミングを知って 「コーディングの引き出し」 増やしましょう
参考文献 • プログラミングGauche Scheme (LISP)の本と見せかけつ つ、同時に関数型プログラミング の初歩に触れられる * FizzBuzzの例題は、この本
をもとにJSで書き換えました