forループを越えて / beyond for loop

#SurviveJS05 発表資料
高階関数を活用してコードを読みやすくする話です

Transcript

1. forϧʔϓΛ௒͑ͯ ౉ลढ़ี ˏcraftgear
2. ߴ֊ؔ਺ͬͯ ͝ଘ஌Ͱ͔͢ʁ
3. ߴ֊ؔ਺ͱ͸ ͨͱ͑͹ɺ
4. ؔ਺ΛҾ਺ʹऔΔ ؔ਺ $('#button').click( e => { console.log(e); } );
5. ؔ਺Λ໭Γ஋ͱ͠ ͯฦؔ͢਺ const createCounter = () => { var number = 0; return () => { number++; return number; }; }
6. Array.map(fn)
7. forϧʔϓͰ͸ͳ ͯ͘mapϝιο υΛ࢖͏ཧ༝
8. ίʔυ ͷ ҙਤ
9. const a = [1,2,3].map(fn)
10. ໭Γ஋aͷܕ ͸഑ྻͰɺ
 ཁૉ਺͸̏
11. ഑ྻͷ֤ཁૉ ʹରͯ͠fnΛ ࣮ߦ͍ͯ͠Δ
12. ԿΛ΍Γ͍ͨ ͔͸fnͷத਎Λ ಡΊ͹Θ͔Δ
13. Θ͔Γ΍͍͢ ί ʔ υ ɺॏཁɻ
14. ϝϯς͕༰қ ฏ࿨ͳίʔυ ϨϏϡʔ
15. fnΛ੾Γग़ ͯ͠ςετ
16. ඼࣭ ޲্
17. UIߏங ʹ΋ศར
18. const dummyTodos = [ { id: 1, title: 'aaaa', done: true }, { id: 2, title: 'aaaa', done: false }, ]; const TodoList = ({ todos }) => ( <div> {todos.map(todo => ( <TodoItem key={todo.id} {...todo} /> ))} </div> );
19. map͚ͩ ͡Όͳ͍
20. map(f) filter(f) reduce(f, init) forEach(f) ഑ྻ [n] [n] [n] [n] ໭Γ஋ [n] [<= n] initͱಉܕ ͳ͠
21. some(f) every(f) findIndex(f) find(f) ഑ྻ [n] [n] [n] [n] ໭Γ஋ ਅِ஋ ਅِ஋ ੔਺஋ ཁૉҰͭ
22. ࢖༻্ͷ஫ҙ
23. filterʹ౉͢fn͕ฦ͢஋ ͸ਅِ஋Ͱ͋Δ͜ͱ -1͸falseʹͳΒͳ͍
24. [].some [].every ͸ৗʹtrue ʮۭڏʹਅʯ
25. ඇಉظॲཧ͸ Promise.all()Ͱ
26. reduce͸ ΄Ͳ΄Ͳʹ
27. chainingͱ compositionͰ ֦͕Δੈք
28. const double = v => v * 2 const over5 = v => v > 5 const a = [1,2,3] .map(double) .filter(over5)
29. import * as R from 'ramda'; const doubleOver5 = R.compose( R.filter(over5), R.map(double) );
30. const b = doubleOver5([2, 3, 4]); const c = doubleOver5( {a: 1, b: 2, c: 3} );
31. ࣮ԋ
32. Thank You!