The Book Nerd's Guide to JavaScript

Transcript

1. 1.

   A Book Nerd’s Guide to JavaScript @angustweets

2. 2.

   None
3. 3.

   Practical, Useful, Mind Numbingly Boring Nonsensical Work of Genius

4. 4.

   What can Literature teach us about Programming?

5. 5.

   Great literature is the creation of open minds As programmers

   our focus can be very narrow
6. 6.

   We’re encouraged to follow only one style…

7. 7.

   Actual excerpts from: Google Style Guide AirBnb Style Guide JavaScript

   Garden
8. 8.

   None
9. 9.

   None
10. 10.

    We’re left with only one way to get from A

    to B :(
11. 11.

    None
12. 12.

    None
13. 13.

    Literature is about embracing the entire language

14. 14.

    When programmers embrace the entire language we get choices…

15. 15.

    None
16. 16.

    None
17. 17.

    "There are indeed many ways to do the same thing

    in JS. That's one of the beauties of the language" - Peter van der Zee (@kuvos)
18. 18.

    None
19. 19.

    None
20. 20.

    (at least until the JavaScript Police get here)

21. 21.

    None
22. 22.

    None
23. 23.

    Perhaps most importantly…

24. 24.

    …Open Minds keep JavaScript fun.

25. 25.

    This one just follows The Good Parts These two learn

    by experiment
26. 26.

    As programmers we’re not encouraged to experiment

27. 27.

    Yet experiment is what keeps JavaScript alive

28. 28.

    “You need a lot of bad code to write good

    code” - Substack (dotJS 2014)
29. 29.

    ‣ if(!!x) ‣ fn && fn() ‣ immediately invoked functions

    ‣ module pattern ‣ promises
30. 30.

    None
31. 31.

    I decided to take experiment to the next level…

32. 32.

    None
33. 33.

    Wait What?

34. 34.

    Twenty Five Authors solving Five JavaScript Problems

35. 35.

    Hemingway developed the Iceberg Theory

36. 36.

    Here is Hemingway’s Iceberg Theory applied to JavaScript…

37. 37.

    (weird shit) (Deceptively Familiar Syntax) (weird shit) JavaScript

38. 38.

    (weird shit) JAVA!! (Deceptively Familiar Syntax) (weird shit) JavaScript

39. 39.

    (weird shit) JAVA!! But Easier!! (Deceptively Familiar Syntax) (weird shit)

    JavaScript
40. 40.

    (weird shit) JAVA!! But Easier!! (Deceptively Familiar Syntax) (weird shit)

    WTF? JavaScript
41. 41.

    Generate Prime Numbers

42. 42.

    None
43. 43.

    // A succession of creatures mount the stairs;! // each

    creature's stride exceeds that of its predecessor! var monstersAscendingAStaircase = function(numberOfSteps) {! var stairs = []; stepsUntrodden = [];! var largestGait = Math.sqrt(numberOfSteps);! for (var i = 2; i <= largestGait; i++) {! if (!stairs[i]) {! for (var j = i * i; j <= numberOfSteps; j += i) {! stairs[j] = 'stomp';! }! }! }! ! // Long-limbed monsters won't tread on prime numbered stairs.! for (var i = 2; i <= numberOfSteps; i++) {! if(!stairs[i]) {! stepsUntrodden.push(i);! }! }! ! // Here, then, is our answer.! return stepsUntrodden;! };!
44. 44.

    1 2 3 4 5 6 7 8 9 10

    11 12 13 14 2 3 Borges vs. Prime Numbers
45. 45.

    None
46. 46.

    function downTheRabbitHole(growThisBig) {! var theFullDeck = Array(growThisBig);! var theHatter =

    Function('return this/4').call(2*2);! var theMarchHare = Boolean("The frumious Bandersnatch!");! ! var theVerdict = "the white rabbit".split(/the march hare/).slice(theHatter);! ! //into the pool of tears...! eval(theFullDeck.join("if (!theFullDeck[++theHatter]) {\! theMarchHare = 1;\! theVerdict.push(theHatter);\! " + theFullDeck.join("theFullDeck[++theMarchHare * theHatter]=true;") + "}")! );! ! return theVerdict;! }!
47. 47.

    function downTheRabbitHole(growThisBig) {! var theFullDeck = Array(growThisBig);! var theHatter =

    Function('return this/4').call(2*2);! var theMarchHare = Boolean("The frumious Bandersnatch!");! ! var theVerdict = "the white rabbit".split(/the march hare/).slice(theHatter);! ! //into the pool of tears...! eval(theFullDeck.join("if (!theFullDeck[++theHatter]) {\! theMarchHare = 1;\! theVerdict.push(theHatter);\! " + theFullDeck.join("theFullDeck[++theMarchHare * theHatter]=true;") + "}")! );! ! return theVerdict;! }!
48. 48.

    function downTheRabbitHole(growThisBig) {! var theFullDeck = Array(growThisBig);! var theHatter =

    Function('return this/4').call(2*2);! var theMarchHare = Boolean("The frumious Bandersnatch!");! ! var theVerdict = "the white rabbit".split(/the march hare/).slice(theHatter);! ! //into the pool of tears...! eval(theFullDeck.join("if (!theFullDeck[++theHatter]) {\! theMarchHare = 1;\! theVerdict.push(theHatter);\! " + theFullDeck.join("theFullDeck[++theMarchHare * theHatter]=true;") + "}")! );! ! return theVerdict;! }!
49. 49.

    ! new Array(5).join('A' + new Array(5).join('a'));! ! >! !

50. 50.

    new Array(5).join("A" + new Array(5).join('a'));! ! > "AaaaaAaaaaAaaaaAaaaa"!

51. 51.

    function downTheRabbitHole(growThisBig) {! var theFullDeck = Array(growThisBig);! var theHatter =

    Function('return this/4').call(2*2);! var theMarchHare = Boolean("The frumious Bandersnatch!");! ! var theVerdict = "the white rabbit".split(/the march hare/).slice(theHatter);! ! //into the pool of tears...! eval(theFullDeck.join("if (!theFullDeck[++theHatter]) {\! theMarchHare = 1;\! theVerdict.push(theHatter);\! " + theFullDeck.join("theFullDeck[++theMarchHare * theHatter]=true;") + "}")! );! ! return theVerdict;! }!
52. 52.

    eval(“if(!theFullDeck[++theHatter]){theMarchHare=1;theVerdict.push(theHatter);theFullDeck[+ +theMarchHare*theHatter]=true;theFullDeck[++theMarchHare*theHatter]=true;theFullDeck[+ +theMarchHare*theHatter]=true;theFullDeck[++theMarchHare*theHatter]=true;theFullDeck[+ +theMarchHare*theHatter]=true;theFullDeck[++theMarchHare*theHatter]=true;}if(!theFullDeck[+ +theHatter]){theMarchHare=1;theVerdict.push(theHatter);theFullDeck[+ +theMarchHare*theHatter]=true;theFullDeck[++theMarchHare*theHatter]=true;theFullDeck[+ +theMarchHare*theHatter]=true;theFullDeck[++theMarchHare*theHatter]=true;theFullDeck[+ +theMarchHare*theHatter]=true;theFullDeck[++theMarchHare*theHatter]=true;}if(!theFullDeck[+ +theHatter]){theMarchHare=1;theVerdict.push(theHatter);theFullDeck[+ +theMarchHare*theHatter]=true;theFullDeck[++theMarchHare*theHatter]=true;theFullDeck[+

    +theMarchHare*theHatter]=true;theFullDeck[++theMarchHare*theHatter]=true;theFullDeck[+ +theMarchHare*theHatter]=true;theFullDeck[++theMarchHare*theHatter]=true;}if(!theFullDeck[+ +theHatter]){theMarchHare=1;theVerdict.push(theHatter);theFullDeck[+ +theMarchHare*theHatter]=true;theFullDeck[++theMarchHare*theHatter]=true;theFullDeck[+ +theMarchHare*theHatter]=true;theFullDeck[++theMarchHare*theHatter]=true;theFullDeck[+ +theMarchHare*theHatter]=true;theFullDeck[++theMarchHare*theHatter]=true;}if(!theFullDeck[+ +theHatter]){theMarchHare=1;theVerdict.push(theHatter);theFullDeck[+ +theMarchHare*theHatter]=true;theFullDeck[++theMarchHare*theHatter]=true;theFullDeck[+ +theMarchHare*theHatter]=true;theFullDeck[++theMarchHare*theHatter]=true;theFullDeck[+ +theMarchHare*theHatter]=true;theFullDeck[++theMarchHare*theHatter]=true;}if(!theFullDeck[+ +theHatter]){theMarchHare=1;theVerdict.push(theHatter);theFullDeck[+ +theMarchHare*theHatter]=true;theFullDeck[++theMarchHare*theHatter]=true;theFullDeck[+ +theMarchHare*theHatter]=true;theFullDeck[++theMarchHare*theHatter]=true;theFullDeck[+ +theMarchHare*theHatter]=true;theFullDeck[++theMarchHare*theHatter]=true;}”);!
53. 53.

    eval(“if (!theFullDeck[++theHatter]) {! theMarchHare = 1;! theVerdict.push(theHatter);! theFullDeck[++theMarchHare * theHatter]

    = true;! theFullDeck[++theMarchHare * theHatter] = true;! theFullDeck[++theMarchHare * theHatter] = true;! theFullDeck[++theMarchHare * theHatter] = true;! theFullDeck[++theMarchHare * theHatter] = true;! theFullDeck[++theMarchHare * theHatter] = true;! }! if (!theFullDeck[++theHatter]) {! theMarchHare = 1;! theVerdict.push(theHatter);! theFullDeck[++theMarchHare * theHatter] = true;! theFullDeck[++theMarchHare * theHatter] = true;! theFullDeck[++theMarchHare * theHatter] = true;! theFullDeck[++theMarchHare * theHatter] = true;! theFullDeck[++theMarchHare * theHatter] = true;! theFullDeck[++theMarchHare * theHatter] = true;! }! if (!theFullDeck[++theHatter]) {! theMarchHare = 1;!
54. 54.

    Alice in Prime Numberland

55. 55.

    Alice in Prime Numberland

56. 56.

    Alice in Prime Numberland

57. 57.

    Alice in Prime Numberland

58. 58.

    Alice in Prime Numberland

59. 59.

    Alice in Prime Numberland

60. 60.

    Alice in Prime Numberland

61. 61.

    Alice in Prime Numberland

62. 62.

    Alice in Prime Numberland

63. 63.

    Alice in Prime Numberland

64. 64.

    Alice in Prime Numberland

65. 65.

    So what did we learn?

66. 66.

    Playing is Learning

67. 67.

    Self-taught programmers are often the best programmers because they get

    to make mistakes
68. 68.

    Experiment, Play, Have Fun and Keep an Open Mind.

69. 69.

    Fin, merci! @angustweets anguscroll.com/hemingway

70. 70.

    Books: http://pixgood.com/classic-book-spines.html/ Montparnasse Tower: http://allparisguides.com Eiffel Tower: Yellow Monster: http://content.mycutegraphics.com/

    Green Monster: http://wondersofdisney2.yolasite.com/ White Rabbit: http://www.clker.com/ Mad Hatter, March Hare: http://wondersofdisney2.yolasite.com/ Cow, tree, office buildings: clipartpanda.com/ Grass: imgarcade.com/ Lion cubs: https://www.flickr.com/photos/mbiddulph/6947067048/ Cheetah cubs: http://www.bhmpics.com/view-cheetah_cubs_playing-1920x1080.html/ ! Image credits