Functional JavaScript First Steps

Wrapping Up

Anjana Vakil

Anjana Vakil

Software Engineer & Educator
Functional JavaScript First Steps

Check out a free preview of the full Functional JavaScript First Steps course

The "Wrapping Up" Lesson is part of the full, Functional JavaScript First Steps course featured in this preview video. Here's what you'd learn in this lesson:

Anjana summarizes what was covered throughout the course and provides resources for learning more about functional programming topics.


Transcript from the "Wrapping Up" Lesson

>> We have come to the end of a very intense day of trying to wrap our heads around some perhaps very different and new concepts about programming that make the act of programming feel pretty different from how we might be used to it when we're thinking about functions, purity.

Side effects, things like that instead of commands and imperative statements, so let's take a moment to reflect on all of the amazing stuff that we have done today. We covered a bunch of stuff. We covered pure functions, what they are how to identify them. What red flags to look for?

How to avoid side effects, and what side effects even are so how side effects are anything that a function does that talks to the outside world other than taking its input arguments and returning its output value. We also looked at some of the key kind of techniques and tools and also consequences of what it means to work with pure functions, and avoid side effects.

So we looked at things using recursion, instead of iteration, to run the same chunk of code multiple times. We looked at using higher order functions which take functions as values or return functions as outputs. And we looked at how to, break functions down break complex functions down into simple ones how the concept of closure allows us to kind of remember or lock in certain values certain arguments to a function.

And then how to build up tiny, small single argument functions into complex programs using function composition and things like pipelining. And then we also talked a lot about mutating data and how we should not do that. And we just now saw some ways some techniques and some tools, some libraries that we can use in JavaScript.

To make sure we avoid mutating any of our data, because that is certainly gonna help us with the predictability, the testability, the debug ability, and just the general understandability [LAUGH] Of the code and the programs that we're writing. When we do functional programming, because that is our whole objective, functional programming can help us write really predictable, really safe, really dependable and testable programmes and hopefully make our lives as developers a little bit easier even if we're not doing super strict hundred percent functional programming, and we're just working in a few ideas from functional programming, maybe I shouldn't mutate this array, maybe I should return a new one.

So that is a hope that now that we have a few key ideas and tools in our toolbox to help us think like functional programmers to understand times when functional programming is a really good fit for problems, and to have some ideas of what we might want to explore in more detail or learn more about next so that we can continue our journey.

So let's take a moment to think about those questions together. What are we taking away today? What are some key ideas and some exciting new things that we wanna look into that we're walking away from this workshop with? Would anybody like to share?
>> This is as exciting because I've been learning React lately and trying to learn class based components versus function based components.

I was realizing that the same thing you mentioned before understanding this and prototypes was kind of mind boggling. So cleaner components that are functional components is somewhat similar to the idea of functional programming I believe in these concepts helped me to think about building one function to solve one portion of my input, output problem.

So build that chain so I can have pipelines that create the result that I want.
>> Awesome, awesome. So yeah, just to recap that, especially coming from the world of React, where we have kind of the class based react components versus the hooks and function based react components, understanding those differences and why might be advantageous to work with those functional style, is something that is maybe very closely related to the contrast between object oriented and imperative code and functional code and also taking away that we're thinking about our programs in terms of those data transformations and how we can really isolate them so that we write functions that just do one thing.

One operation on one input, getting one output, and then put those together through pipelines to create more complex programs. Amazing, amazing points. Anyone else have takeaways to share?
>> I think the pipelining where it is very similar to a Unix pipeline, that's where something really clicked for me.

I might just be because I really come from a server management background. But that was the point where that's how it works. So that's the logic behind it.
>> Yeah, definitely. So for folks that have spent a lot of time at the command line or working with Unix systems, and pipelining fields sort of second nature when you're piping commands from one end to the next that is very similar in concept to how we're thinking about functional programming where each command does one thing.

It takes an input, it gives an output, and we can put them together in these pipelines in these composed programs as it were to get more complex work done. So yes, absolutely great to see connections being drawn between other areas of programming that might not have anything to do with JavaScript.

Because functional programming pops up again and again and some of those key ideas can pop up even in places where you might not expect it. So keep an eye out for those similarities. Really great point. Thank you.
>> I assume that this is functional programming is kind of how you would build a strong and secure API.

One that, one that can handle when they, the input is going to be this, you're going to get the same output for every single endpoint that the person hits. It's going to give that exact output. Is that is that true? Do you think API when you create an API you should be thinking in terms of Functional programming.

>> Should you be thinking in terms of functional programming and deterministic kind of input and output out functions? When you're thinking about designing API's? I think that it is a great teacher as it were that functional programming can teach us a lot that is super useful for implementing things like API's.

Again so API's often have a lot of kind of side effecting operations that we need to do. Maybe we need to store things to databases or maybe we need to, output things. But again, we can push all of that into a certain outside edge of our program and think instead about okay, what are the computations that I need to do?

What are the data structures the data values that I have coming in and what are the things that somebody needs me to give them back out and thinking about that in, in any kind of. Program that we're trying to write where people are asking us, hey, I want this resource or hey, tell me what's going on with that thing over here.

Give me this this particular I don't know cat picture on the internet. Those are really great cases where where we can you can take a lot of value from these functional programming concepts of how can we think about this less in terms of what steps do I need to take to do this thing, imperative style, and more in terms of what are my inputs.

What are my outputs? And how can I break that process down into smaller operations that are easier to write and easier to think about? So absolutely. And personally, I think it's a really great mindset. To get into, when we're thinking about any kind of program, right? Even if it is just to ask myself, should I be thinking about this in terms of the steps that I need to take, or should I be thinking about this in terms of the data transformations that need to happen, the inputs and the outputs?

And even if the answer is, what in this case, I actually think an imperative step, do this do that oriented kind of mindset is more helpful for me here. Taking that moment to reflect and think, will thinking functionally helped me solve this problem and help make my system diagram simpler, for example, is a really great question to be asking ourselves.

Excellent points, everybody. Okay, well, I don't know about you all, but I think we've really stretched our brain muscles today. And so, it is always good to give your brain a little bit of a rest. But the most important thing is that we have all come together. Today.

We've thought really hard about a lot of really tough problems. And I just wanna thank you all so much for being here. Whether we are doing this all together in this call or whether you are perhaps watching the videos later and thinking through this on your own time, thank you so much for taking the time, taking the energy.

It takes a lot of energy to stretch your brain like this. To try to wrap our heads around these, these ideas and these concepts and this new mindset. So thank you so much for coming along on this journey through some functional JavaScript first steps with me I also want to give a huge shout out to all the folks at the Recurse Center, a programming community in New York who helped me first wrap my head around so many of these concepts.

And want to give a huge thank you to front end masters for having me and for observable for making all of these notebooks and my time here possible. But most of all, thank you all for struggling through these exercises and through these tough concepts. And please make sure this isn't the end of your functional programming journey.

The Learning continues indefinitely forever. So there is another notebook in this collection with some references and further reading for you. So at the end of this collection you'll find a next steps notebook. You'll find this next steps notebook. Here with a lot of references and further reading, including some of the things that I've mentioned today, including some other front end masters courses you might want to take and some more in depth resources on some of these more individual specific topics that we've gone through.

Also some links to some other libraries and languages that you might want to check out for things like functional programming, utilities and JavaScript. So I hope that this gives you some good starting points for your functional JavaScript next steps. Now that we have taken our first steps into understanding what is going on in this wild world of functional programming and how can we start applying some of those ideas to our own code right in our JavaScript code bases.

So thank you all so much, and we'll see you next time.

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