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
Elements of Functional Programming in JS
Search
Adam Stankiewicz
May 27, 2014
Programming
2
160
Elements of Functional Programming in JS
Lightning talk from Meet.js Wrocław.
Adam Stankiewicz
May 27, 2014
Tweet
Share
More Decks by Adam Stankiewicz
See All by Adam Stankiewicz
LinemanJS
sheerun
0
110
Consuming and Packaging of Web Components
sheerun
4
410
Promises/A+
sheerun
5
400
Other Decks in Programming
See All in Programming
請來的 AI Agent 同事們在寫程式時,怎麼用 pytest 去除各種幻想與盲點
keitheis
0
130
アプリの "かわいい" を支えるアニメーションツールRiveについて
uetyo
0
280
そのAPI、誰のため? Androidライブラリ設計における利用者目線の実践テクニック
mkeeda
2
2.8k
楽して成果を出すためのセルフリソース管理
clipnote
0
190
はじめてのMaterial3 Expressive
ym223
2
900
もうちょっといいRubyプロファイラを作りたい (2025)
osyoyu
1
460
時間軸から考えるTerraformを使う理由と留意点
fufuhu
16
4.8k
Putting The Genie in the Bottle - A Crash Course on running LLMs on Android
iurysza
0
140
Compose Multiplatform × AI で作る、次世代アプリ開発支援ツールの設計と実装
thagikura
0
170
Oracle Database Technology Night 92 Database Connection control FAN-AC
oracle4engineer
PRO
1
470
Ruby Parser progress report 2025
yui_knk
1
460
How Android Uses Data Structures Behind The Scenes
l2hyunwoo
0
480
Featured
See All Featured
Optimising Largest Contentful Paint
csswizardry
37
3.4k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
35
3.1k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
30
9.7k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
32
1.6k
Faster Mobile Websites
deanohume
309
31k
Producing Creativity
orderedlist
PRO
347
40k
We Have a Design System, Now What?
morganepeng
53
7.8k
Gamification - CAS2011
davidbonilla
81
5.4k
Rails Girls Zürich Keynote
gr2m
95
14k
GraphQLの誤解/rethinking-graphql
sonatard
72
11k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
Transcript
Elements of Functional Programming in JavaScript
What is functional programming? No generally accepted definition, but: •
Style of building computer programs • Avoids state and mutable data • Functions as arguments and results
Benefits of functional programming • More concise, readable code •
Confident refactor, better reasoning • Better concurrency? • Performance (function inlining)
JS has some functional elements • First class functions •
Anonymous functions (lambdas) • ???
JS lacks many functional elements • Tail call optimization •
Pattern matching • Forced immutability (type system) • No standard methods for FP (IE <=8) ◦ Array#forEach, Array#map, Array#filter, etc...
Libraries for FP in JavaScript • Underscore • Lo-Dash •
Mout.js (for Node.js)
Short map syntax var characters = [ { 'id': 1,
'name': 'barney', 'age': 26 }, { 'id': 2, 'name': 'fred', 'age': 30 } ]; _.map(characters, function(c) { return c['name']; }) // ['barney', 'fred'] _.map(characters, 'name') // ['barney', 'fred']
Short filter syntax var characters = [ { 'id': 1,
'name': 'barney', 'age': 26 }, { 'id': 2, 'name': 'fred', 'age': 30 } ]; _.filter(characters, function(c) { return c.age == 30; }) // [{ 'id': 2, 'name': 'fred', 'age': 30 }] _.filter(characters, { age: 30 }) // [{ 'id': 2, 'name': 'fred', 'age': 30 }]
General pattern // function(e) { return e['foo']; } // 'foo'
_.sortBy(characters, 'name') // function(e) { return e['foo'] == bar; } // { 'foo': bar } _.every(characters, { 'name': 'barney' })
GroupBy var words = ['one', 'two', 'three'] _.groupBy(words, 'length'); //
{ '3': ['one', 'two'], '5': ['three'] }
IndexBy var users = [ { 'id': 100, 'name': 'Adam'
}, { 'id': 200, 'name': 'Ala' } ]; var indexedUsers = _.indexBy(users, 'id') indexedUsers[100] // { 'id': 100, 'name': 'Adam' } indexedUsers[200] // { 'id': 100, 'name': 'Ala' }
Find var users = [ { 'id': 100, 'name': 'Adam'
}, { 'id': 200, 'name': 'Ala' } ]; _.find(users, { 'id': 100 }); // { 'id': 100, 'name': 'Adam' }
max, min var characters = [ { 'name': 'barney', 'age':
26 }, { 'name': 'fred', 'age': 30 } ]; _.max(characters, 'age') // { 'name': 'fred', 'age': 30 } _.min(characters, 'age') // { 'name': 'barney', 'age': 26 }
reduce var numbers = [1, 2, 3]; _.reduce(numbers, function(sum, element)
{ return sum + element }); // 6
Composing functions var characters = [ { 'name': 'barney', 'age':
26 }, { 'name': 'fred', 'age': 30 }, // ... ]; var ages = _.map(characters, 'age'); // [26, 30] _.reduce(ages, function(a, b) { return a + b }); // [56]
Composing functions var characters = [ { 'name': 'barney', 'age':
26 }, { 'name': 'fred', 'age': 30 }, // ... ]; _(characters) .map('age') .reduce(function(a, b) { return a + b; });
Composing functions var characters = [ { 'name': 'barney', 'age':
26 }, { 'name': 'fred', 'age': 30 }, // ... ]; _(characters) .map('age') .reduce(function(a, b) { return a + b; });
Other features • Set operations (difference, union, intersection) • every,
some, reject, countBy, contains • clone, extend, defaults, merge, mapValues • delay, defer, memoize, once, throttle • now, random, uniqueId, template
Promises A+ • Pattern for running async code • Allows
for return in callbacks • Safely handles exceptions in callbacks • Allows for try/catch -like behavior • Chaining of callbacks, parallel execution promise.then(onSuccess, onFailure)
Promises A+ $http.get('/users/1').then(function(user) { return $http.get("/users/posts"); }).then(function(post) { return render(post);
}).catch(function(reason) { console.log(reason); });
Dzięki