Hi!

First of all,

I just want to give a big shout-out to the organizers of this conference.

I feel like this has been a fantastic smooth experience from start to finish,

so...

[Applause]

Amazing job.

Hi! I'm Anjana Vakil.

I am an English teacher turned computational linguist

turned software developer

and as I mentioned a little bit earlier today,

about six months ago, I knew nothing about functional programming

and very little about JavaScript.

So, what I want to do today is kind of

take you guys along on some of the things I've learned

about doing functional programming in JavaScript

and I am not an expert in any of this,

so this is going to be me taking you along on my learning journey

and nothing more.

I'm going to try and save a little time for questions at the end,

but we'll see how that turns out.

So, how did I end up standing here

talking to you guys about functional programming in JavaScript?

About six months ago in the fall of 2015,

I went to a programming community in New York City

called The Recurse Center

which quick plug

is probably the best programming community I've ever experienced

and it's a programming retreat

where you can go and learn about

whatever is interesting to you in the world of computer science

and so I got there

and a lot of people were talking about functional programming,

functional programming, Haskell, Clojure, all this cool stuff,

a lot of people were working in JavaScript getting into node

and these were some really interesting topics

and so I started talking to people there

and finding out what is all this stuff.

So, what is functional programming?

Few different ways that question can be answered.

First of all, it's a programming paradigm.

Some other paradigms are like imperative programming

where you say do this and then do that

or object-oriented programming

which maybe a lot of you write object-oriented JavaScript

where you have objects and they have methods on them

and you change them, etc., etc.

Functional programming is also a paradigm

where functions are king

and we'll talk about what that means in a little bit.

It's also a style of coding,

of organizing your code,

writing your code,

style of approaching projects

and really more than that it's kind of a mindset you can get into,

a way of thinking about a problem,

a way of approaching a task

and it's also a really sexy trend

with lots of buzzwords that'll make you super popular

when you're talking with people at the pre-conference party or whatever it is.

No, just kidding.

But it is something that's gotten a lot of attention

and, so yeah, I thought it was important

to find out why everybody was so excited about it.

So, why do functional programming in JavaScript specifically?

Well, I don't know about for all of you,

perhaps more experienced JavaScript developers,

but when I started learning JavaScript

having had some object-oriented programming experience with Java, C-Sharp,

that kind of thing,

I found object-oriented JavaScript super confusing,

prototypal inheritance, how does that work?

How many of you guys, quick show of hands,

have ever run into a bug or a problem or something unexpected with this,

doing something...

Yeah, exactly. Right?

So, I found that really tricky and confusing

and so I thought, all right, I know I want to get more into JavaScript

but let me set aside the object orientation

and try to think about things in a functional way

which is maybe simpler in some ways

and avoid some of these problems

like bugs introduced by binding this to the wrong thing.

So, functional JavaScript to me at least is a bit safer,

a bit less tricky,

a bit easier to debug

but easier to maintain as you're building a project

and we'll take a look at some of the features

that make that easier in a bit.

Also, there is already a huge community of developers

who are doing JavaScript in a functional style,

so there's a lot of libraries out there

to help you write functional JavaScript.

There's a lot of people out there that are experts in this,

for example, there was a talk in the next room over earlier today on Ramda

and there are people here you can talk to

that probably know a lot more about functional JavaScript than I do,

but the point is there's already a community,

so this isn't necessarily something you'd be doing on your own,

grappling you versus JavaScript,

there's other people to support you,

which I found really helpful.

Okay.

So, hopefully by now I've convinced you

that functional programming is at least interesting

and that we could do it in JavaScript to avoid these headaches, etc.

How can we do it?

What does it mean?

This is what I was asking myself.

So, the main thing

and maybe it sounds like a tautology or obvious is that

in functional programming

you want to do everything with functions,

so we want to express everything in our program in terms of functions.

And a function of course is just something

that takes an input and gives an output.

So, we want to be thinking about

kind of the flow of data of inputs and outputs through the program,

instead of thinking about objects and how they interact

and how they manipulate

or thinking about steps in a recipe like in an imperative style.

Here we're really thinking about how we can express everything

in terms of functions,

taking inputs, giving outputs.

So, for example,

this would be a non-functional way for me to get the text

“Hi, I'm Anjana” to appear on the screen.

I could assign a variable, I call it “name”

and have it store the text “Anjana.”

I could have a greeting like “Hi, I'm” or “Hello, I'm”, whatever,

and then I could log that to the console.

This is sort of an imperative style.

First do this, then do that, then do this other thing,

we don't have functions here,

we're not expressing this in terms of how inputs are transformed into outputs.

So, maybe a more functional way of doing the same thing

and this is a really simple example, just for the sake of it,

is to define a function called greet

which takes a parameter name

and returns a string which adds “Hi, I'm”

to the beginning of that name.

So, for example, if I type greet,

the string Anjana,

feeding that as input

then I get the output “Hi, I'm Anjana”,

that's a more functional way expressing this in terms of functions.

Okay. So, another...

maybe the main thing about functional programming

is to avoid side effects

and instead to use pure functions.

So, what does that mean?

A side effect is anything that a function might do

that isn't computing its output from the inputs you've given

and returning that output.

So, for example,

printing something to the console is not returning an output,

it's doing something else,

something that's on the side of the function

or if you have a function that uses some globally defined variable

to compute its output

that doesn't depend only on the input to that function,

so that's not pure.

It's taking something from outside the function

and involving it in some way in what the function does.

So, this is just a really quick explanation of what a pure function

that avoids side-effects would do.

For more information on that

there's excellent Wikipedia articles on these sorts of things,

but basically the idea is that

you want your function to do nothing

except take its input, use that and only that

to compute an output

and then return it.

That's pure.

So, for example, this function here,

we have this globally defined variable name

which gets used in the function

as you can see in the last line there,

it gets used, so there's no input,

we don't have name as an argument to this function,

it's just reading something in from the global state.

That's not pure.

Also, not pure because

the return value of this function here isn't what we care about,

we care about doing something,

changing the world in some way

other than the return value,

in this case, printing to the console.

So, this is a not pure function here.

A pure function might look like this.

Here we have,

the only thing that matters

to the output of this function is its input,

the argument that we pass to it

and the only thing that it does is return its output.

Okay, so I've been talking for a while now about pure functions

that's because this is really like a key thing at least for me,

something I've taken as one of the key parts of functional programming

is thinking about things as purely as possible.

Another key point would be using higher-order functions.

So, this means functions that can take as inputs other functions

or a function that can return a function as its output.

So, basically, we're treating functions kind of as objects themselves.

They can be passed to other functions.

You can have layers of functions within functions within functions, etc.,

and these are what's called higher-order functions,

they come up a lot in functional programming.

This is a bit of a random example,

but let's say we have this function at the top here,

makeAdjectifier

where we give it an adjective

and it returns actually a function.

It doesn't return a string or a number or anything like that,

it returns us a function

which adds that adjective to a string that you give it.

So, for example, I can use the makeAdjectifier function

feed it the input “cool”

and get a function that's called coolifier.

So, now when I pass a string to coolifier,

I get “cool” added to that string.

So, if I pass conference, I get cool conference.

So, the idea here is that we have a higher-order function

which returns a function.

And this kind of wrapping your head around this

at least for me

is one of the key things to being able to write in a functional style

because as we'll see a bit later,

we need these higher-order functions

in order to avoid some of the tricks

that we're used to using from other paradigms.

So, learning the thing to get into that functional mindset

for me really involved wrapping my head around this concept.

Okay.

So, one of these things that we're going to avoid

that we're used to doing is iterating,

using like “for” or “while”, these sort of things.

We're used to going over lists and doing things to all the items in it.

Instead, in a functional style,

we might use higher-order functions like Map or Reduce or Filter

which often take as an input

not only the list that you want to do something to in some way

but also a function that then you're going to apply to it.

In the interest of time I'm not going to go into too much detail

about what Map, Reduce, and Filter do,

but I found and also thanks to my colleague Khalid up there,