Check out a free preview of the full Functional-Light JavaScript, v3 course

The "Observables" Lesson is part of the full, Functional-Light JavaScript, v3 course featured in this preview video. Here's what you'd learn in this lesson:

Kyle defines observables and explains them as being analogous to a spreadsheet involving a lazy, asynchronous flow of data.

Preview
Close

Transcript from the "Observables" Lesson

[00:00:00]
>> Kyle Simpson: Can you see why lazy array, if it existed, would allow us to adapt all of the concepts that we know about functional programming, we know how to do them over arrays. Well, now we can do them over lazy arrays, which means we can do all of these functional things over time, including even things like transducing.

[00:00:17]
You could even do monads over time. Everybody follow what I'm saying, if we had this sort of a lazy array or a lazy map sort of function. Well, we don't have map lazy, and we don't have lazy array, but what we do have is called observables. A lazy array, the way I have formulated it for you, is essentially, conceptually an observable.

[00:00:44]
>> Kyle Simpson: If you haven't heard about observables, my favorite metaphor for them is it's kind of like a spreadsheet. If you take a value in a spreadsheet, like you put three in the cell A1, and then over here in cell B5, you say B5 is whatever is in A1 times two.

[00:01:03]
And so now B5 is showing you the value 6, right? Because you have three here and six here. What happens if you change that to 4? If you change sell A1 to 4, what's going to show up and cell B5? Instantaneously it's gonna show 8, right? There is a relationship between the cell B5 and A1 and that relationship is a mapping that doubles the value.

[00:01:28]
It is that equation that is mapping the value. And that is essentially the same thing as what we were just showing. It's the idea of an observable which is an asynchronous flow of data. If I put the number four here, it flows through a mapping operation over to this other cell and if I were to take another cell like C10 and have it be whatever is in B5 plus one, what a C5 gonna be showing, it's gonna be showing 9 now.

[00:01:57]
What happens if I change this value to 5 again? Well, now, we're gonna have 5, 10 and 11. You see how the data flowed asynchronously through that stream? That's my favorite metaphor for describing the concept of an observable.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now