
Functional Programming in JavaScript: A Collection of Hands-on Exercises - AllThingsSmitty
http://jhusain.github.io/learnrx/
======
bcrescimanno
Former Netflix employee here; I think I can give some context (and I'll ping
@jhusain to let him know this is here if he wants to chime in). These
tutorials were created initially to share functional programming concepts with
Netflix engineers who were unfamiliar with FP. Jafar created these exercises
and taught classes using the material here as the primary source material for
the courses. This was all back in 2012 into early 2013 when Netflix was going
big with Reactive Extensions.

What good is Rx when a huge number of your team don't really get FP--let alone
FRP.

I know a lot of folks have found these exercises useful. I think the odd
format of not showing further material until an exercise is complete was more
tailored to the structure of the class that these accompanied rather than
something meant for standalone presentation online. That said, the exercises
are still quite valuable.

~~~
seanmcdirmid
I know this is pedantic, but are we still calling Rx as FRP? It doesn't even
work well to Rx's advantage (simplicity): grokking Rx can be much easier than
grokking FRP, which is much more pure and restricted (though also more
powerful).

~~~
mattpodwysocki
RxJS author here. We on the RxJS team have never called RxJS FRP as we do not
have a continuous notion of time, instead we have a notion of virtual time.
That and we do not distinguish between events and behaviors as they all are
Observable objects.

~~~
seanmcdirmid
Virtual time as in Jefferson's Time Warp system?

~~~
mattpodwysocki
As in you can specify the time at which things execute and swap out the
concurrency model at any time. This makes it perfect for testing:
[https://github.com/Reactive-
Extensions/RxJS/blob/master/doc/...](https://github.com/Reactive-
Extensions/RxJS/blob/master/doc/gettingstarted/schedulers.md)

~~~
seanmcdirmid
It doesn't seem to be very related. Virtual time as defined in jefferson's
seminal paper is a variation of Lamport's virtual clocks used in distributed
discrete simulations; it is the analog of virtual memory.

The name clash wouldn't be such a big deal (systems is far away from webdev),
but time warp is also very related to transactions and FRP in providing
abstractions to deal with change in reactive programs.

~~~
mattpodwysocki
It's not. Virtual time can mean anything in this case as in not real time and
it can be swapped out at any point.

------
aikah
2 very good "donationware" books about javascript functional programming,for
those who want to study it in depth :

[https://leanpub.com/javascript-spessore/read](https://leanpub.com/javascript-
spessore/read)

[https://leanpub.com/javascript-allonge/read](https://leanpub.com/javascript-
allonge/read)

please check it out and tip Reg,frankly his work is outstanding.

~~~
andrzejsz
From what I can see functional programming is significant but not only part of
javascript allonge and javascript spessore contains references to fp but it
doesn't seem to be focus of this book

~~~
aikah
Sorry but these books are in my opinion the best one can find about FP in
JS,and I read a lot of them,especially allongé,which goes in detail in a lot
of advanced FP concepts.You should actually read these books.

~~~
andrzejsz
I did not deny that FP is leading theme in javascript allonge quite the
opposite but it does not apply to javascript spessore I am afraid

------
damncabbage
To just _see_ the content on the page, paste this into the console:

    
    
        $('body').append('<style>.lesson,.post{visibility:visible;}</style>');
    

(I enjoyed reading the content, but found it infuriating to skim.)

------
michaelmior
I just consistently get the following on Firefox

    
    
        TypeError: verifier is not a function

~~~
Nyubis
Same here. More and more websites seem to target only Chrome (or Webkit), it's
the IE6 situation all over again.

~~~
acqq
Sorry! I wanted to upvote. I'm also trying to find out how the the downvote
got registered.

Edit: I've found it, it's curiously related to the "which browser"
discussion(!):
[https://news.ycombinator.com/item?id=8475210](https://news.ycombinator.com/item?id=8475210)
(Posted from the Firefox this time!)

------
jhusain
Original Author here. I fixed the Firefox bug and merged a pull request to
allow answers to be transferred to other browsers. I will add a Show All
Answers button soon for folks who just want to browse.

rcfox: These exercises teach functional programming concepts, and that
includes composition as it applies to the Observer pattern. I use RX but you
could also use bacon JS or build your own lightweight Observable library. You
should check out rx.lite.js which is a minimal subset of the library. As for
your concerns about including a library, I urge you to reconsider if you can
afford the extra download size. The Observer pattern is ubiquitous in software
and you'll be amazed how versatile Rx is. At Netflix we use it on the server
and client for a wide variety of different tasks. Rx has more than paid for
itself 10 times over.

~~~
mattpodwysocki
@jhusain not only that but we did introduce a CLI which allows you to bring in
only what you need: [https://github.com/Reactive-
Extensions/RxJS/releases/tag/v2....](https://github.com/Reactive-
Extensions/RxJS/releases/tag/v2.3.12)

Still in its early days but is very promising for making RxJS as small as you
wish.

------
softbuilder
[http://underscorejs.org/](http://underscorejs.org/)

For those not already familiar with it, Underscore is a wonderful functional
programming library that lets you code in a functional style while insulating
you from many of Javascript's quirks.

~~~
nawitus
I think Lo-Dash is a better alternative.

~~~
thejosh
Not trying to start a flamewar, but are there instances where you would use
underscore instead of lodash?

~~~
dustingetz
yes, for example, [https://github.com/documentcloud/underscore-
contrib](https://github.com/documentcloud/underscore-contrib)

~~~
ninjaplease
You could theoretically use this on top of lodash though, correct?

~~~
jdd
There's lodash-contrib too – [https://github.com/TheNodeILs/lodash-
contrib](https://github.com/TheNodeILs/lodash-contrib)

------
ObviousScience
Wow, it's terrible UI to hide most of your content until I complete a
challenge when all you're making is an educational piece.

I wanted to read it, then noticed most of the page as blank space, shrugged,
and moved on.

~~~
mattpodwysocki
RxJS author here and creator of some of those exercises. This was meant as a
hands on lab where we proctor the event. We've given this at a number of
conferences including QCon, CodeMesh, among others to great success. If you
have suggestions, please do file an issue and I'll make sure we get them
addressed:
[https://github.com/jhusain/learnrx](https://github.com/jhusain/learnrx)

------
unknownBits
Type error: verifier is not a function. is what I got for the first exercise..

Btw, keep it real and solve in CS like so:

console.log name for name in ["Ben", "Jafar", "Matt", "Priya", "Brian"]

~~~
pluma
I'm pretty sure the exercises are called "Functional Programming in
JavaScript", not "Functional Programming in CoffeeScript".

------
rcfox
I don't know if this was obvious to anyone else, but based on the comments
here, the tutorial seems to be discussing RxJS[0]. The tutorial itself makes
no mention of using any libraries.

It's a little disappointing because the Observable object sounds like a neat
way of solving some complexity that I've run into recently, but I'm not sure
that I want to pull in a whole library for it.

[0] [http://reactive-extensions.github.io/RxJS/index.html](http://reactive-
extensions.github.io/RxJS/index.html)

~~~
mattpodwysocki
The RxJS author here. This was meant to be training for Netflix team members
to become familiar with RxJS as they use Rx for pretty much all of their
systems, whether front end or back end.

We've made great strides recently making Rx more accessible including making
it easier to pull in only the things you want/need:
[https://github.com/Reactive-
Extensions/RxJS/releases/tag/v2....](https://github.com/Reactive-
Extensions/RxJS/releases/tag/v2.3.12)

------
Noelkd
If you want a version that works in firefox:

    
    
        git clone https://github.com/M0ns1gn0r/learnrx.git
    

And you can keep it forever!

------
ibash
I went through this tutorial a few weeks back. It's very well laid out and by
the end of it you really want more lessons.

------
levlaz
This is very helpful! Thanks to OP for sharing. :)

------
Yadi
Oh I love this Thanks! Gotta try some of them out!

