Functional Programming in JavaScript: A Collection of Hands-on Exercises | Hacker News Reader

Functional Programming in JavaScript: A Collection of Hands-on Exercises

jhusain.github.io

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.

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).

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.

Virtual time as in Jefferson's Time Warp system?

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/...

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.

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.

I am going through it just now. I like not having the further material available, as it makes me try a lot harder to get the solution and not scroll down.

That said, I go some strange syntax error, as its a JavaScript editor, and doesn’t highlight unmatched braces or things like that (useful in JavaScript, as it seems to encourage heavy nesting). Not as nice to learn in as a proper IDE.

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-allonge/read

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

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

"Allonge" is very much about FP and - more importantly! - about the uses of FP in a language with mutable state, objects and so on. It's more pragmatic and immediately useful than The Little/Seasoned Schemer, but this doesn't make it any less about FP.

"Spessore" is about OOP, but described from unusual angle: it reminds me of "The Little Java, a Few Patterns" in this regard. It's a great description of how and why OOP works, from the most basic concepts up.

Reg's articles on FP in JS and Ruby let me fill the gaps in my knowledge I had because of having no formal education in maths. I was interested in FP for years, and I learned much about it on my own, but Reg's texts made it all "click" for me. I definitely recommend reading all of them; unless you're really familiar with this stuff, from both theoretical and practical sides, I can guarantee that you'll learn something new and useful.

Really, go read them. See also https://leanpub.com/coffeescript-ristretto if you prefer CS.

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.

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

I didn't know that Reg came out with another book. Allonge is really good. I have high hopes for Spessore.

Although I had only brief look I would confirm of it being awesome so you should't be disappointed

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.)

I just consistently get the following on Firefox

    TypeError: verifier is not a function

Funny, an issue for that error was filed back in March 2013: https://github.com/jhusain/learnrx/issues/9

And a pull request fixing it was submitted back in August: https://github.com/jhusain/learnrx/pull/27

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

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 (Posted from the Firefox this time!)

RxJS author here. I'll make sure that it's more cross platform as I do actually work for Microsoft. This has been a Netflix only training platform, but in order for us to teach more, we have to be better about supporting all browsers.

same. seems to work only in safari and chrome.

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.

@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....

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

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.

Actually ramda is a better choice if you want FP because everything is auto-curried by default and the argument order makes the curried functions a bit more useful:

http://ramda.github.io/ramdocs/docs/

I think Lo-Dash is a better alternative.

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

yes, for example, https://github.com/documentcloud/underscore-contrib

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

There's lodash-contrib too – https://github.com/TheNodeILs/lodash-contrib

To be more explicit. Underscore is a great library and it let's you use functional programming concepts on collections. However, RX is about unifing that use to streams and more familiar events.

Summary: I wouldn't skip this great tutorial because you've used Underscore and think some of these concepts are similar.

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.

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

It was design for IRL teaching. That said, if you know FP already and want to see what they say about it, it's annoying to go through the steps manually. Time to hack the class I guess. Functionally.

    jQuery(".lesson").css("visibility","visible")

Same. I literally scrolled down, didn't see anything, so I figured the page must be buggy / not working and I closed it...

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"]

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

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

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....

If you want a version that works in firefox:

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

And you can keep it forever!

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.

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

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

Reply on news.ycombinator.com