Course Introduction: Safer JavaScript with the Maybe type

Understand the Maybe Data Type

Create a Maybe with a `safe` Utility Function

Unwrap Values from a Maybe

Safely Access Object Properties with `prop`

Safely Access Nested Object Properties with `propPath`

Flatten Nested Maybes with `chain`

Recover from a Nothing with the `alt` method

Recover from a Nothing with the `coalesce` Method

Compose Functions for Reusability with the Maybe Type

Apply a function in a Maybe context to Maybe inputs

Make your own functions safer by lifting them into a Maybe context

Safer JavaScript with the Maybe Type

We can dot-chain our way to great success with an instance of Maybe, but there are probably cases where you need to apply the same series of transformations against different `Maybe`s. In this lesson, we’ll look at some point-free versions of some common Maybe methods and see how we can compose them together to get a reusable function that can be applied to any Maybe instance.

Instructor: [00:00] I've defined a function that takes in an object, extracts the name property, and verifies that it's not empty, giving us back a maybe. In the case where this results in a nothing, we use the alt method to recover with a just of nope.

[00:13] Then, we apply the create URL utility function to the result and extract the value with the option method. We can see that calling this with the article object results in a URL. If I set this to an empty object that doesn't have a name property, we'll see that we get the default of nope as our URL slug.

[00:30] I'd like to break this process down into smaller pieces of functionality so I can reuse those pieces and easily create new functions with slight variations. To make this easier, Crux provides functions that coincide with the maybe methods we're using. These point free utilities provide the same functionality, but instead of hanging off an instance of maybe, they accept an instance as their last argument.

[00:53] Let's import the functions we need to turn this URL creation process into a function composition. We'll jump up to the top of the file where we're already importing maybe prop and safe from Crux. Then we're going to add compose, because that's what we're going to use to put these together. Then, we're going to import functions that represent each of these methods.

[01:10] If we look at our existing get URL function, we're using chain, alt, map, and option as methods of that maybe instance. We're going to have corresponding point free utility functions to match each of these. We can pull in chain, alt, map, and option. Then, I'm going to come down here. I'm going to take this existing get URL function. I'm just going to comment that out for reference.

[01:35] We're going to declare get URL again. This time it's going to equal call to compose. Compose is going to get the functions that we need to basically rebuild this functionality using those point free utilities. A composition is going to go from right to left. We're basically going to reverse the order of what we already have.

[01:54] We're going to start. We're going to say option gets called with default after map is called with create URL. That happened after our alt with our maybe of our default value of nope which is being called after chain. We're chaining our call to safe because it's going to return a nest of maybe.

[02:25] We'll do is not empty string there. Then that's being called after prop for name. We're going to leave the object out of it, because that's going to be the argument that gets passed in to get URL. That'll be the first thing.

[02:38] It'll hit this curried version of prop. Then it's going to pass those values until we get our URL out on the other side. We can get rid of these, clean that up. We'll see that get URL is still working like it did before. If we pass in an object that doesn't have a name, we get our nothing. It recovers using that alt with a maybe of nope.

[03:03] Let's say I wanted to be able to get the name in the same exact way for use in other places in my code. Because we're using a function composition here, it's going to be really easy to pull these things apart, make smaller building blocks, and then snap them back together in different ways.

[03:18] Let's start by creating the function that represents this prop and chain combination. I'm going to cut those. I'm going to come up here. I'm going to define this. I'll call it get sluggable name. This is going to be a composition where I'm just going to use my prop and chain.

[03:37] Then, I'm going to call this as the first piece of this composition for get URL. By putting get sluggable name there, we're right back to where we were. But now, we have this reusable piece that we can use in other compositions. We can do the same thing here where we create our URL and then extract the value. Let's cut these.

[03:58] I'm going to come up here. I'm going to define another function. I'm going to call this get URL or default. That's going to equal another composition. I'm just going to paste those functions in here. Now, we have a composition that's going to take a maybe, map it over create URL, and then extract that value with default as the value.

[04:23] We can put that right back in here. Our original function goes back to doing exactly what it did before. But now, it's just three functions and a composition. I have these other two functions that are easily reusable in other parts of my code base. Now, I can easily reuse these functions to create different composition.

[04:43] I can come in here. Let's duplicate this. We're going to call this new copy get URL or nope. We're going to leave that with the original functionality. We'll come back to that in a second. We're going to take the alt out of here. Let's say we just want this process where if we get a nothing, we actually show this default value from option.

[05:04] I can come down here. If I change this and pass in an object without the name, we'll see that we don't get a URL at all. Now, we have the option of doing it with the actual default value from option or doing the version with the recovery. If I just update this and say or nope, then we're going to get that version.

[05:25] Or we can come in here. We could create another function. Let's say get URL or whoops. We'll just change this default value here. Then we can come back down. Now, you see we have the same exact functionality except for the recovery step which we changed.

[05:49] We didn't have to redefine the portion where we get the name off the object or create the URL and extract the value. We just changed the part that we cared about changing. Now, we have more functions, but each one is more specialized. We can put them together in whatever combination makes the most sense for us...

Course

Safer JavaScript with the Maybe Type

Compose Functions for Reusability with the Maybe Type

Share this video with your friends