MountainWest JavaScript 2014

RXJS (Reactive JavaScript), la nueva cara de la programación funcional

Ryan Anklam  · 


Extracto de la transcripción automática del vídeo realizada por YouTube.

so hopefully I don't spend too much time going over what jefra did and kind of reiterate his concepts in just a slightly different way we're covering a lot of the same things but just in it from a slightly different approach so bought me real quick

I am a senior UI engineer on Netflix and like jaffer point out we do a lot of rx stuff we do a lot of rx stuff with Java we do a lot of rx programming with groovy and of course we do a lot of rx stuff with JavaScript I'm also known as bitter street riot

Ryan pretty much every run the internet so follow me on Twitter if you like to talked about JavaScript check out my github page if you want to see some of the stuff I've worked on and before I begin I just want to start off with a real quick public service

announcement and that's to be kind to those of us with OCD so who this picture make anyone else squirm raise your hand alright good so you'll understand this next slide then and that's please change your Dropbox icons to the black and white icon

all right if you suffer from OCD and are talking to someone that has that blue icon we won't hear anything you say all we're gonna do is look at that icon so this right here will make us much happier and we'll actually be able to listen to you

alright so when we're talking about reactive JavaScript it's built highly on top of functional programming so I want to make sure that we all have a very solid understanding of a lot of the functional concepts that we're going to use to build upon

to create these nice functional observable streams so the first one I want to talk about I'm gonna talk about the map function the filter function the reduce function and a function called zip so again the map function when we think of the map function

we're actually thinking of data transformation right we're taking a collection of objects passing them into a projection function one item at a time and turning it into something else but we're not actually going to change our original collection

so here we're just going to create a new set our new collection that's going to take a key up a collection and change it into something else so this map functions going to take every key that's pressed and turn that into an AJAX request that's

going to return another observable of JSON results the next function I want to talk about is filter and that's going to kind of narrow a collection down so we're going to expand upon that search result sets here and we're gonna make sure that we

only want to take certain or get search result sets if their input is one character greater so if we don't want to go and search a huge data set for just a write we want to make sure it's a little bit more specific so we want to check for a B or something

like that and then we can just take that and turn those key presses again into that JSON data now reduces a real interesting one it basically is going to take a collection and kind of turn it into a single value so here we have some eight or a variable called

HTML that's going to be equal to the reduction of that search result sets function and so this projection function we pass in two search results sets is going to get two arguments passed into it a previous and current that previous argument is going to

be whatever that function returns and the current value is going to be the next item in that collection so here we're just taking that search result sets so a list of values and turning it into a single string of HTML that later on we can probably insert

into the Dom or something like that the next one I want to talk about is zip zip Swilley a hard one to wrap your mind around at first because you don't really see the usefulness of it but when you start doing a lot of reactive programming you'll notice

that you get a lot of lists of data that aren't always connected and all the times you want to connect those and turn them into a single value so in this example here we have an array of movies and another collection that's an array of box arts for

those movies but right now they're not actually synchronized right we have these just to two different arrays so using the zip function we can take these two arrays and zip them together to combine them into a single data structure that we can actually

[ ... ]

Nota: se han omitido las otras 2.124 palabras de la transcripción completa para cumplir con las normas de «uso razonable» de YouTube.