function a Monday morning show where we
try to become more excited and confident
about programming by exploring old
wisdom wild ideas and having fun streams
are really just what it sounds like a
stream of data you can think of it as a
an actual real life screen with the
barrels floating down on it or something
where you can attach a thingy at the end
of the stream to handle each individual
barrel of data you can also think of
stream as the result of promise and
array having a baby an array that’s a
that’s a series of multiple objects that
are already there while a promise is a
notion of a single object that might be
there eventually a stream is a throw of
values that will arrive whenever they
just bloody well feel like just to get
down and dirty really quickly we’re
going to look at the most simple
implementation of a stream that I could
think of normally I would ask you to
pause the video and take a look at this
before moving on but let’s face it
you’re not gonna do that so instead I
will leave this room for 30 seconds and
let you contemplate this code in
solitude before I tell you what I think
you
this is stupid number stream it is an
object that contains a series of numbers
that will arrive in the future to
subscribe to the stream we pass a
callback function in this case console
dot log to the each method of the stream
and that will unsurprisingly log the
numbers out to the console stream
libraries such as the one built into
nodejs or rxjs or bacon or Highland
objects they all have a multitude of
other functionality but in the end that
is the core essence of what a stream is
it’s just a way of modeling a flow of
values that is arriving whenever they
feel like but what is the point of
screams what what do we use streams for
historically the most common use case
for streams is when you need to process
a pile of data that is so huge that you
cannot fit all of it in memory and you
need to do some kind of transformation
on each row if you read those ten
gigabytes of data into memory you would
probably run out of memory and even if
you had all that memory it would still
take tons of time to actually read it up
into memory before you could start
processing it a better way to deal with
this problem is to read one row at a
time and process each one individually
you model the big file reading as a
stream and then you attach a handler at
the end of the screen and you process
each row individually until you’re done
I’m going to show you an example to keep
this from getting too abstract let’s
imagine that we have this huge file of
customers that is comma separated so we
have Matias here and he has made two
orders this this quarter or whatever
applicants has made six and king mukla
has made four right cool so that’s our
file we need to read that in and for
that we’re going to need to pull in the
FS namespace wire FS cool and then we
are going to create a read stream
ah from customers dot CSV and typing is
hard now this is going to return a note
stream but hmm note strings are good and
all but we want something more powerful
so we’re going to pull in Highland and
Highland SCS these hubs handy stream
library and we’re gonna get stood up he
I mean stall high land we’re getting
some warnings here because I don’t have
a package.json in my desktop directory
where we’re playing around with this but
that doesn’t matter just just clear that
way now in order to make this note
stream into a Highland stream we just
call Highland all in that and now that’s
Highland stream and we can call the
function each on that and we just gonna
pass that to console dot log and see
what this turns out to be and run it
okay no such file or directory alright
its customers let’s try it again alright
we’re getting just a buffer and that is
because we are not passing any string
encoding today read stream it’s not
gonna assume anything and just give us
the byte offer but that doesn’t help us
much so we’re gonna add utf-8 and we are
good BAM so we’re getting the contents
of the file here I’m not sure if we’re
getting this as one string or as as
individual lines from the read stream
something just got just gonna add a
little something here each X and see
I began see see here we are getting this
as one big string and we don’t want that
we want it as limes so let’s just do a
split here see what that turns out cool
now we’re getting it as a strings so
next up we want to transform this into
some kind of more handy actual objects
instead of these these comma separated
strings first I guess that we want to
split them up and create a race of the
of the strings so I’m just gonna go and
map each value and I’m going to call
split on each value and we’re gonna
split by comma see what that gives us
not quite what I expected I think it’s
because this X is when I plus these two
it’s going to concatenate them so right
that looks better
arrays are a bit cumbersome to deal with
so I want to make this into a proper
data object with properties and stuff so
let’s try and pull that hearts we’re
getting calling these I’m going to call
that a that array parts then we are
going to return a new object I’m adding
these here these extra parentheses
otherwise
the JavaScript interpretive will
interpret this as a function block but I
wanted to interpret it as an object and
we are going to call the first one name
and then parts here and then I’m going
to call the num purchases here a call
that again the part stops one run that
and see what we get okay cool now we’re
getting somewhere here we have each
object here it looks pretty right but
Matias here we want to filter him out be
it’s not a project
really interesting customers only made
to purchase this quarter so I’m going to
call a filter on him and we’re gonna do
cuz so Marwa filter the least useful
customers out dot nam purchases when
that is the only well customers that
have more than two purchases that gives
us yes these two and yes for good
measure we want to get only the names so
I’m gonna do custom name and that would
just give us the names what I want you
to take away from this code is that we
are just working with very simple
functions here that do almost nothing
and they have no side effects and that
makes it really easy to reason about our
code another use case for streams that
have started gaining traction in the
recent years is in front then
programming where things such as
keyboard input or mouse movements or
mouse clicks can be modeled as streams
of events you touch functions as
handlers on the end of these streams and
they usually end up manipulating the
application state and the application
state is also often implemented as a as
a stream so you have other parts of the
application often the render function
listening to that state and just
rendering whenever the state changes
this is gotten popular because it’s
really nice to have most of your
application be stateless because state
is a major cause of bugs having state
contained in just one or two places
makes it a lot easier to reason about
your application and prevents of other
bugs let’s take a look at one of the
examples on the baked on J s from
patient bekandjesse is a streaming
library of sorts
what we see here is a simple counter
widget see here that when I press up it
goes up and when I press down it the
counter here goes down nothing strange
about that and you see that the up
button here that’s up the up button here
and the down the down button is this
down identify here and the counter here
that is this counter here so you see
that we call as event stream here and we
are interested in the flick events so up
and down will now be streams of events
what we see them doing here is that they
call the NAP method on the on the up
stream and they map that stream to once
so now every time we get an up click
event that will result in transformation
– once the column entry would but we’re
going to look at this down cold here
first so what they do is that they call
map on the down stream remember down is
a stream of clicks on the down button so
each such click will be transformed into
a -1 value and now they will call pass
that stream the stream of all the minds
ones and merge that with the other
stream all the streams of the ones the
Plus Ones and now this entire thing here
this entire line is now going to be a
new stream with the all our Plus Ones
and minus ones and what we’re going to
do is they are going to call scan on
that stream and scan it is it is
basically just a three me version of
reduce it it just does exactly what
reduce does it gets the
ah takes the last value and the new
value that gets and it adds them
together and it will emit the new the
new number that gets asked add value so
this will effectively constantly counter
stream which is also stream will return
or constantly emit the new counter value
and if you take a look at what they do
with counter here is that they assign
that value or the values that are
continually emitted from the counter
they will assign them to the text
property of the counter element that is
that is how this all ties together what
I think that we should take away from
the last two examples is that screams
compose well together I really feel like
I’m coming back to composition all the
time when I’m talking about functional
programming but it is really at the core
of what functional programming is when
we model our clicks as streams of events
we get access to all this stream tooling
that we can use on the streaming tooling
doesn’t really care what this is a
stream of doesn’t know that it’s clicks
or even that it’s events it just knows
that it is a stream of values that’s all
it needs in order to help us out with
modeling streams and running things like
map and filter and stuff on them so on
one hand you have these simple functions
without side effects they just take a
value and they do something with it and
they return a new value on the other
side you have piles of inputs it might
be a big file that is 10 gigabytes big
or it might be mouse clicks if you model
your mouse clicks or your file as a
stream you can actually have the stream
be this adapter that allows you to use
and reuse all those
simple functions on both of those kinds
of events and this is so fundamental for
functional programming we have input
here our data here and we have our
functions here they are separate so that
we can reuse them as much as possible
data and functions are separate they are
garble together like they are in
object-oriented programming that’s it
for today we have learned that a stream
as a flow of values that will arrive
whenever they feel like if you want to
start playing with this there are a
couple streaming libraries out there our
rxjs bacon and Highland and I’m gonna
link some of them in the description as
usual the next episode of fun fun
function will be released on Monday
morning 8:00 a.m. GMT time do not miss
it subscribe to me on the Twitter until next Monday morning stay curious