Hardcore Functional Programming in JavaScript Maybe Functor

[00:00:00]
>> [MUSIC]

[00:00:04]
>> Brian Lonsdorf: So a functor, you guys have just learned about functors. Any object or data structure that you can map over, that implements a map function, and there are laws, so it also has to obey these laws. But think of it as just, if it has a map function it's, a functor.

[00:00:20] Unless you're jQuery and you don't do it right. [LAUGH] Resig, somebody went to the bathroom, I don't wanna wait, in case they're pooping, but I feel like this is a really important. Okay, so we have, that was really embarrassing. I shouldn't have said that. Down to the bottom get the get the name parts, cool.

[00:00:46] All right, I wanted to wait for you, man, I didn't want you to miss this. Here's here, I just defined a functor. It's anything with a map method. All right, so, we've got a problem now. Let's put this into some real use, not just put stuff into containers for no reason.

[00:01:05] Cuz container didn't do anything for us, it just made things more complicated. So here we can actually get an element with the query selector, so I pass the full name ID selector, into document query selector, which will get the element. Then we'll get the value out of that.

[00:01:23] We'll call dot value on it, basically. And then, we're going to split it on I guess, space, right? So whatever you type into first full name will come back with like an array of your first, last, or middle or something like that, right? So we're gonna name parts from this field.

[00:01:43] What if query, what if it doesn't find full name? What's up.
>> Speaker 2: Hey, Brian, we got a couple questions from the chat.
>> Brian Lonsdorf: I'm glad, thank you, keep asking questions.
>> Speaker 2: All right, Danielle B is you can do a quick definition again, on partial applications. She's not sure what that means.

[00:02:00]
>> Brian Lonsdorf: It's just giving a curried function, less arguments than it takes. So you're partially applying it because you're only giving it part of it. There is some technical details that you may want to say kerning is this and partial application is that. I use them interchangeably, it doesn't really matter to me.

[00:02:18] So yeah, you can you could just give split, for instance, right there is being partially applied with the space, instead of the whole thing, instead of the space in the string which would run it. So what if it doesn't find? Is there other questions?
>> Speaker 2: There might have been but, do we query so we don't have to check for existence?

[00:02:43] Or is the lack of existence check, a result of query?
>> Brian Lonsdorf: They don't relate. You query because you want to concisely define, in a generic way, a function by giving it some some data. Like if I wanted to, right there on get value, I've made a new function by only giving it its first argument.

[00:03:13] All right, so yeah, but we're gonna get in the nulls. This is just the slide one of them pesky nulls, there's another one. So if query selector doesn't find full name, like if we misspell it or we forget that underscore, it's gotta be null on getElement. And then when I call get value, it's gonna be like, I can't get value of null.

[00:03:33] I'm just going to die. And if you try to split that, it's just going to go down the tubes, down the drain right? Boom, is what I mean. [LAUGH] So it blows up because there needs to be a null check. Now, we could implement some crazy function that wraps everything and say, all right, if it gets the value combinator, check null first, and then run these functions.

[00:03:55] And that's possible, it's functional. Do it. But there's a cooler way that gives you some theory and stuff behind it. Let's me our first functor. I made these baseball looking cards for each one. [LAUGH] They're like from 1990, 1991 or something or 1989. Looks like Saved by the Bell.

[00:04:12] [LAUGH] Anyway, so this is gonna capture a null check. This is, it's the maybe functor, right? The value may or may not be there, and you can see a bunch of different implementations and scholar for instance, it's option and you have some and none in high school you're gonna have just and nothing.

[00:04:33] We gonna simplify this a bit by rolling these subclasses and just the one type. Because it's easier to just kind of grok at first, but later on it'll work, you'll get it works like either, when we look at that. So the idea here is that, you may or may not have a value in your container.

[00:04:51] Let's look at that. And again this is a little bit of a simplified version, but all I'm doing is I took out the if not null, and if not undefined. But right now it's just checking if it's truthy. But the idea is that if it's there, we're gonna apply the function and if not, we're just going to return null, whatever.

[00:05:14] Don't do it. So now if we map capitalize over our flamethrower, we get is just like a container. But we have a null check in our map. It's gonna do an our null check every time we map over it. So if we call capitalize a maybe null, it doesn't run it.

[00:05:30]
>> Speaker 3: So what you're saying is the underscore maybe is now your container.
>> Brian Lonsdorf: Yes.
>> Speaker 3: You've redefined the container
>> Brian Lonsdorf: Yes, well in addition to container, I've defined maybe.
>> Speaker 3: Okay, in addition to that.
>> Brian Lonsdorf: And by the way, I have this underscore maybe and then down there I'm just calling maybe without underscores, that's my constructor helper the calls new.

[00:05:51] But this is pretty cool. Check this out. If you look at how we're calling this function on the value inside the maybe, this.val is the property inside maybe, we're in its prototype, we can look at its internal value and decide whether or not to run this. We've abstracted function application.

[00:06:09] That is so powerful. We can say, you wanna run this function on me? No. [LAUGH] So this is pretty great. Every step of the way, if you put your value in a maybe, it will do a null check. And it won't run if it's null. Now, let's look at another example, I suppose.

[00:06:30] This is one just using compose. So if we have this function, that's just going to find the first match. And we do dogsup, there is no match of cat and dogsup. So it blows up because we can't call first or no. Are people still being tripped up? I know this is pretty new for you guys.

[00:06:47] You just saw compose, you just saw partial application. We're using both. We're partially applying match, which is waiting for a string to tell of. So it's gonna be a lot of new information. But I want you guys to kind of get the stuff. Be able to take it home.

[00:07:01] Play with the, do the exercises. And get a real feel for it. But right now, ask me if you have questions. We'll get through it. So if it blows up, right in between that match and first, we stuck a maybe. And then we mapped first over it. Let's go back and forth a few times.

[00:07:18] All right, camera one, camera two, camera one, camera two. I'll hold it on here for a minute, then go back so that everybody sees. [LAUGH]
>> Speaker 3: Wouldn't you want to somehow wrap what you're passing in?
>> Brian Lonsdorf: Well, dogsup is there. But the match may return a null. It might not match cat, which returns null in JavaScript cuz match is, it'll either return the match or a null, or actually returns an array of, anyway, or a null.

[00:07:55] Which is stupid cuz it should just return empty array, it would have worked like maybe. But anyway, the point is that once, at the point of when it becomes null, like at this point right here, I keep forgetting about this wonderful green thing. So at this point right here, we might have a null.

[00:08:12] So we're gonna drop it in the maybe by running the maybe constructor. It's just, if we look a little bit back, maybe is just a function, right? If I, down to the bottom, where I put the flamethrower and maybe, I'm just calling maybe with flamethrower. So I could just drop maybe in the middle of a composition and whatever is there goes into maybe.

[00:08:33] So here, if match might return a null in between match and first, and there's going to be null right here, and it's blowing up my app. I could drop maybe in there, and put it in there. And then I can map first over it, because I can't call first on maybe.

[00:08:50] I have to map first over maybe. If I don't not first over maybe, first will be like I can't, it'll be like bracket or something, cuz it's gonna get the string of the object and try to be object, object. Anyway, so the point is that you have a null, and we're gonna drop it in maybe a map over that.

[00:09:06] We're gonna see this more and more. But we're about to do some exercises so you guys can play with yourself. But we need to lock this down, cuz this is easiest functor.