The full video and many others like it are all available as part of our Frontend Masters subscription.

Brian Lonsdorf

Brian Lonsdorf has taught several workshops and training courses on functional programming with javascript. He'a a regular speaker at conferences and helps organize/host FP events around the Bay Area.

Brian Lonsdorf

SFJS Co-Organizer

Brian moves on to exercise two. In this exercise, you need to use _.head to get the first element of the list. After a few hints, Brian gives the group some time to work through the solution. He also answers a few questions while they work and explains maps a little more in-depth.
- Problem: http://jsbin.com/yumog
- Solution: http://jsbin.com/xiwofojura

Get Unlimited Access Now

Brian Lonsdorf: So, everybody play around with Identity. See if you can get exercise one to pass and exercise two, and ask me questions. Hey, Brian. Could you look at Mims W, look at the chat to double check that his or her understanding is correct? Yes, totally right. Mims W, to clear this up, map is not list's map, map is my map, that just calls map on whatever it gets.

So let's clear this up a little bit just to make sure you guys understand. I have an Identity of 2. And I can map add(1) to it. And then I should get an Identity of 3, result. So let's run it and look at our result. toString. Cannot read property of undefined.

result Identity map add 1. Sorry, it always gets me. There it is. So this map is the same as this map up here, where I can do identity of 2, or whatever, the string 2, or 29, or an array of a string of 29. So the idea is that, well, I guess then I couldn't add 2 to it.

But yeah, map is not list map, it’s a different map that works on anything.
Off Camera 1: So the slide where you brought in of week three, that's what has that implementation in it. Is that what I'm seeing up, line 3 and 4?
Brian Lonsdorf: Yes, map is the PointFree's map.

What it's going to do is exactly, Mims pointed this out. Am I saying that right? Map is the one I showed right here, and then glazed over and walked away from. There it is. That's my map. It just calls map on whatever object it is. So, but it's curried, so works like a list map, but it works on any functor.

A list is a functor, or an array is a functor, and so is identity. And so is maybe. So what you're really going to be doing is calling .map when you call this line. One thing that's really cool is, this map is like, I'm waiting for my second argument.

It could be any functor at all. I'm just going to call .map on it. It's an interface, it's .mappable, you know what I mean? So up here, you need your specific thing, but down there you don't.
Speaker 3: Also, anybody can raise their hand if you're having trouble with the exercises.

That was easy.
Speaker 4: So, Yeah, Christian T wants to make a note that at some point, he would love to hear if there's any production-ready libraries to do this fantasy-land type stuff. We are.
Brian Lonsdorf: We'll be showing you the libraries that we're going to use in our demo later, but we'll go through a couple of the libraries we're using.

I have to say, the state of libraries is not where it should be, because a lot of this is really new. It's like if you picked up Node the day it was invented, and you were like, man, where's all my plugins? I'm like, go make them. You're going to be awesome for making them.

So.
Brian Lonsdorf: Strategy design pattern, cool analogy. Passing in a function as a strategy, beautiful.
Speaker 3: So it's like a new function I can keep talking, but might as well just wait. How do I know that is going to be applied over this Identity there's no reference. Does that make sense?

Yeah, so what I was doing is basically giving a double reference to.
Off Camera 1: I think at this point, right, right, right. So, I think this is- You were trying to take the result and apply it over a function.
Speaker 3: I was, yeah, this is what I was doing, right?

Off Camera 1: Yeah, we have trouble doing this, is because, yeah.
Speaker 3: I get it.
Off Camera 1: Totally.
Speaker 3: Cool. Thank you.
Off Camera 1: Hey Joe, is there anything I could say that might clear things up? I know, that's the- The feeling of being over there.
Brian Lonsdorf: Yeah, what's the one thing that I could say that'll make everybody grok functors?

If you get rid of the word functor from your vernacular, you just say mappable, I want to map over a mappable.
Off Camera 1: That just means run inside.
Brian Lonsdorf: Map-over-able.
Off Camera 1: Everybody else okay with the exercises, or not?
Brian Lonsdorf: But yeah, to cut to the chase, the production-ready code is few and far between.

But what's good about this stuff is it's out there and it's scattered, and it needs help.
Brian Lonsdorf: Okay, let's see here.
Brian Lonsdorf: Just so you guys understand example two, xs is an Identity of a list. It's not a list, it has, I keep saying list, it has an array inside the Identity.

So you can't call head on Identity, you have to map head over Identity. So head will work on the list, not the Identity itself. You can think of it as, if I want to add 1 to a list. Let me do that. So I have this add(1) function, let me just call it inc.

If I want to inc a list, that's not going to work. That's just going to blow up. And it's not because there's a lot of things, it's because it's inside a list, and inc expects a number. Even if there's one thing in the list, it's not going to work. You have to map inc over that list to get a new list of five.

And in that exact same way, if it wasn't in a list, it was instead in identity.
Brian Lonsdorf: We have to map inc over Identity, because inc doesn't take Identity, it takes the value inside of it. So now we'll get an Identity of 5.
Brian Lonsdorf: And if you want a real nuts, we have an Identity of a list, and we want to inc over that, we've got to map map.

Whoa-ho!
Brian Lonsdorf: For those of you who aren't quite crying yet.
Speaker 5: Is that the goal, to get us to cry?
Brian Lonsdorf: That's what we're here for, it's therapy, proto-therapy.
Brian Lonsdorf: Raise your hand if you do understand it. We've got three-ish?
Off Camera 1: Do you understand what, again?
Speaker 4: I got it working.

Brian Lonsdorf: You got it working? All right. You got it working? All right.
Off Camera 1: Who doesn't have it working, I guess.
Brian Lonsdorf: Okay, yeah.
Speaker 4: Which one, two?
Brian Lonsdorf: Yeah, let's talk about two. Do you guys want to do two together?
Off Camera 1: Yeah.
Speaker 4: Sure.
Brian Lonsdorf: I don't want to take up, these are supposed to take time.

I mean, you're supposed to play with it and learn with it. I'm not like, hurry! So if you don't to go over it, tell me to hold on. I don't want to spoil it for you. How about you guys online? Do you want me to, Christian T wants me to go over it?

Or is he like, I know it? Franco's good. Looks like Myles is either drowning or happy.
Speaker 4: I think that's supposed to be the rock fist maybe? I never thought of it as a person drowning, but I guess I could see it.
Brian Lonsdorf: It's that. I can't do that because my pinkies are crooked.

It's kind of embarrassing I just documented that. Eternalized.
Speaker 4: There's some stuck on two and some good on two. Some stuck on three. And some stuck on three.

Ready to take your code to the next level?

Intense courses with world-class teachers and unlimited access to our growing library of videos for the great price of $39 per month.

Get Unlimited Access Now