The Future is Old - Functional Programming in JavaScript

Transcript

1. FUNCTIONAL PROGRAMMING THE FUTURE IS OLD
2. hi, I'm @jergason
3. who are you?
4. ASSEMBLY
5. .global main .text main: mov eax, 55 ; load two numbers into registers mov ebx, 45 add eax, ebx ; add them (result stored in eax) push eax push ebx ret
6. ✨fancy assembly✨ most programming is
7. let userName = prompt('Name, scallywag?') let upperCaseName = userName.toUpperCase() alert('Yar, ' + upperCaseName + ' is a foul appellative indeed.')
8. Assembly (1949) C (1972) C++ (1983) Java (1995) JavaScript (now-ish)
9. Assembly (1949) C (1972) C++ (1983) Java (1995) JavaScript (1995)
10. how CPUs work is a terrible way to program
11. ᕕ( ᐛ )ᕗ
12. BEFORE COMPUTERS
13. Alonzo Church
14. lol i invented lambda calculus
15. FUNCTIONS not INSTRUCTIONS
16. Functions are MAPPINGS
17. x y f(x) = x^2 3 9
18. LISP (1958) ML (1973) Haskell (1990) λ calculus (1932) ISWIM (1966)
19. Why do you care?
20. stateless functions
21. function add(a, b) { fireZeMissiles() return a + b }
23. function add(a, b) { fireZeMissiles() return a + b } var deathToll = 0 function fireZeMissiles() { if (deathToll > 7000000000) { console.log('the world has ended. everyone is dead') return } deathToll += Math.round(Math.random() * 100000000) console.log('Oh no, ', deathToll, ' dead') }
24. return value only determined by input no side effects no dependencies
25. function augment(obj) { obj.myVal = 'foo' return obj } var obj = {} augment(obj) console.log(obj) // {myVal: 'foo'}
26. SHARED MUTABLE STATE
27. function augment(obj) { return _.assign({}, obj, {myVal: 'foo'}) } var obj = {} var newObj = augment(obj) console.log(obj) // {} console.log(newObj) // {myVal: 'foo'}
29. never write for loops
30. var output = [] for (let i = 0; i < array.length; i++) { let changedData = changeData(array[i]) output[i] = changedData }
31. var output = [] for (let i = 0; i < array.length; i++) { let changedData = changeData(array[i]) output[i] = changedData } UGH NO WHY GAH
34. let output = map(changeData, array)
35. function map(f, arr) { var a = [] for (var i = 0; i < arr.length; i++) { a.push(f(arr[i])) } return a }
36. map - transform an array filter - remove items from array reduce - turn array to one value each - do something with each value
37. FUNCTIONS not INSTRUCTIONS
38. currying
39. function split(delimiter, string) { return string.split(delimiter) } console.log(split('.', 'foo.bar')) // ['foo', 'bar']
40. function split(delimiter, string) { return string.split(delimiter) } function splitNewlines(string) { return split('\n', string) }
41. function split(delimiter, string) { return string.split(delimiter) } function splitNewlines(string) { return split('\n', string) } function splitShrug(string) { return split(`¯\_(ツ)_/¯`, string) }
42. function split(delimiter) { return function(string) { string.split(delimiter) } } let splitNewlines = split('\n') let splitShrug = split(`¯\_(ツ)_/¯`)
43. let split = curry(function(delimiter, string) { return string.split(delimiter) }) let splitNewlines = split('\n') let splitShrug = split(`¯\_(ツ)_/¯`)
45. composition
46. function createUser(username) { return { username, password: 'beans' } } function hashUserPassword(user) { return { username: user.username, hash: user.password.toUpperCase() } } function createHashedUser(username) { return hashUserPassword(createUser(username)) }
47. function compose(f, g) { return function(x) { return f(g(x)) } }
48. function createUser(username) { return { username, password: 'beans' } } function hashUserPassword(user) { return { username: user.username, hash: user.password.toUpperCase() } } let createHashedUser = compose(hashUserPassword, createUser)
49. compose(hashUserPassword, createUser) username user
50. let createUser = compose(hashUserPassword, createUser) let u = createUser('jamitron') console.log(u) // {username: 'jamitron', hash: 'BEANS'}
51. separate side effects and stateless code
52. a completely stateless program is useless
53. side-effecting stateless
54. pokemans
55. react
56. elm
58. work at kualico ask me @jergason
59. Sources • http://www.infoq.com/presentations/Taming-Effect-Simon- Peyton-Jones • https://github.com/MostlyAdequate/mostly-adequate-guide • https://www.destroyallsoftware.com/screencasts/catalog/ functional-core-imperative-shell • http://learnyouahaskell.com/ • http://elm-lang.org/ • http://www.infoq.com/presentations/Value-Values
60. Sources • http://www.infoq.com/presentations/Simple-Made-Easy-QCon-London-2012 • https://en.wikipedia.org/wiki/Functional_programming • https://en.wikipedia.org/wiki/Imperative_programming • https://www.youtube.com/watch?v=oYk8CKH7OhE • http://haskell.cs.yale.edu/wp-content/uploads/2011/01/cs.pdf • https://www.cs.kent.ac.uk/people/staff/dat/tfp12/tfp12.pdf • Coders at Work • https://en.wikipedia.org/wiki/Lambda_calculus
61. Images • 2001 vector art - couldn't find original source, see http://wallbasehq.com/images/big/ 2001_a_space_odyssey_space_suits_vector_art_wallpaper-3587.jpg • http://vignette3.wikia.nocookie.net/2001/images/4/41/A_itmes.jpg/revision/latest? cb=20111116211153 • https://sjmj91.files.wordpress.com/2013/02/2001space043.jpg • https://flic.kr/p/5J1zrp • http://i.imgur.com/F2rWHbb.gif • https://i.ytimg.com/vi/Tj6n2YhFuqg/mqdefault.jpg • https://www.flickr.com/photos/bohman/16062901379/in/photolist-qtqyXv-86kuSi-7Xi4jn-abhEnd- uujbAG-abhAEy-abeGDt-o6zUda-dSLBvP-94CfH9-abhvMA-bUUme1-cobi7q-8YEbSy-n9e9eN-a1HRJH- dMBF1h-5woynn-7ZBp9H-9aJJ5m-8teEAc-8eDSbB-6ZwXL1-7bXjDd-8feUCk-9yHDJx-aZbzfr-duPLHD- eWYsiy-6TTARf-74HG5i-duNd4J-cWWjFG-abeLZX-v7jH5m-v7jHJ7-uXyiKa-6oWZC3-e1UNqc-8phgVx- v7jF85-5XuumM-8ioqe2-vpfrnX-abeEt2-abhvq5-7SVK8Z-abeLSk-4hEHCs-abeGya • http://assets22.pokemon.com/assets/cms2/img/pokedex/full/001.png