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
The Book Nerd's Guide to JavaScript
Search
Angus Croll
November 17, 2014
Technology
14
4.3k
The Book Nerd's Guide to JavaScript
Given at DotJS, Paris on 17th November 2014
Angus Croll
November 17, 2014
Tweet
Share
More Decks by Angus Croll
See All by Angus Croll
Stop being Perfect
anguscroll
11
1.6k
ES6 Uncensored
anguscroll
72
12k
Learning to Fly — Twitter Flight and Mixins
anguscroll
23
4.6k
JavaScript is Literature is JavaScript
anguscroll
21
3.4k
The Politics of JavaScript
anguscroll
122
23k
Parlez-Vous JavaScript
anguscroll
33
6.4k
Break all the Rulez
anguscroll
42
16k
How we Learned to Stop Worrying and Love JavaScript
anguscroll
90
22k
Other Decks in Technology
See All in Technology
後進育成のしくじり〜任せるスキルとリーダーシップの両立〜
matsu0228
2
1.1k
ACA でMAGI システムを社内で展開しようとした話
mappie_kochi
0
160
PythonとLLMで挑む、 4コマ漫画の構造化データ化
esuji5
1
120
「Verify with Wallet API」を アプリに導入するために
hinakko
1
200
Azure Well-Architected Framework入門
tomokusaba
0
190
Oracle Base Database Service 技術詳細
oracle4engineer
PRO
11
77k
Flaky Testへの現実解をGoのプロポーザルから考える | Go Conference 2025
upamune
1
390
FastAPIの魔法をgRPC/Connect RPCへ
monotaro
PRO
1
660
ユニットテストに対する考え方の変遷 / Everyone should watch his live coding
mdstoy
0
110
Go Conference 2025: GoのinterfaceとGenericsの内部構造と進化 / Go type system internals
ryokotmng
3
590
Sidekiq その前に:Webアプリケーションにおける非同期ジョブ設計原則
morihirok
17
7k
Windows で省エネ
murachiakira
0
150
Featured
See All Featured
What's in a price? How to price your products and services
michaelherold
246
12k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
46
7.6k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
Mobile First: as difficult as doing things right
swwweet
224
9.9k
A designer walks into a library…
pauljervisheath
208
24k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
15
1.7k
Why You Should Never Use an ORM
jnunemaker
PRO
59
9.5k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
49
3.1k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
358
30k
Statistics for Hackers
jakevdp
799
220k
Why Our Code Smells
bkeepers
PRO
339
57k
Imperfection Machines: The Place of Print at Facebook
scottboms
269
13k
Transcript
A Book Nerd’s Guide to JavaScript @angustweets
None
Practical, Useful, Mind Numbingly Boring Nonsensical Work of Genius
What can Literature teach us about Programming?
Great literature is the creation of open minds As programmers
our focus can be very narrow
We’re encouraged to follow only one style…
Actual excerpts from: Google Style Guide AirBnb Style Guide JavaScript
Garden
None
None
We’re left with only one way to get from A
to B :(
None
None
Literature is about embracing the entire language
When programmers embrace the entire language we get choices…
None
None
"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)
None
None
(at least until the JavaScript Police get here)
None
None
Perhaps most importantly…
…Open Minds keep JavaScript fun.
This one just follows The Good Parts These two learn
by experiment
As programmers we’re not encouraged to experiment
Yet experiment is what keeps JavaScript alive
“You need a lot of bad code to write good
code” - Substack (dotJS 2014)
‣ if(!!x) ‣ fn && fn() ‣ immediately invoked functions
‣ module pattern ‣ promises
None
I decided to take experiment to the next level…
None
Wait What?
Twenty Five Authors solving Five JavaScript Problems
Hemingway developed the Iceberg Theory
Here is Hemingway’s Iceberg Theory applied to JavaScript…
(weird shit) (Deceptively Familiar Syntax) (weird shit) JavaScript
(weird shit) JAVA!! (Deceptively Familiar Syntax) (weird shit) JavaScript
(weird shit) JAVA!! But Easier!! (Deceptively Familiar Syntax) (weird shit)
JavaScript
(weird shit) JAVA!! But Easier!! (Deceptively Familiar Syntax) (weird shit)
WTF? JavaScript
Generate Prime Numbers
None
// 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;! };!
1 2 3 4 5 6 7 8 9 10
11 12 13 14 2 3 Borges vs. Prime Numbers
None
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;! }!
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;! }!
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;! }!
! new Array(5).join('A' + new Array(5).join('a'));! ! >! !
new Array(5).join("A" + new Array(5).join('a'));! ! > "AaaaaAaaaaAaaaaAaaaa"!
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;! }!
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;}”);!
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;!
Alice in Prime Numberland
Alice in Prime Numberland
Alice in Prime Numberland
Alice in Prime Numberland
Alice in Prime Numberland
Alice in Prime Numberland
Alice in Prime Numberland
Alice in Prime Numberland
Alice in Prime Numberland
Alice in Prime Numberland
Alice in Prime Numberland
So what did we learn?
Playing is Learning
Self-taught programmers are often the best programmers because they get
to make mistakes
Experiment, Play, Have Fun and Keep an Open Mind.
Fin, merci! @angustweets anguscroll.com/hemingway
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