How many words do you use to describe money? Bills, Bengemins, notes, dinero, cheddar, change, stacks, v-bucks… You could get a long list going pretty quick.

That’s because we give lots of names to things we value. And JavaScript is no different.

Functions go by the terms callbacks and methods. They can be anonymous or have names. They’re defined with declarations and expressions. They describe iterators and comparitors. They’re written with arrows or blocks. They invoke immediately or lazily. They’re described as first-order or higher-order — if they take or return functions themselves. And that’s not half of it! 🙀

There’s a lot to know about functions. But remember that they’re all still functions.

What we’ve used so far

We’ve explored Array.prototype.map in depth.

map is a method — meaning it exists on an array instance and gets called thru that instance: someArrayIntance.map(...)

map is also a higher-order function — meaning it takes another function as an argument: someArrayIntance.map(anyFunction)

map uses the provided function as an iterator callback — meaning that it gets called on each item in that array: item => iteratorCallback(item).

And — so far — we’ve been writing this iterator callback as anonymous arrow function expressions. But it can also written as a named function declaration: someArrayInstance.map(function myCompariton(item) { return transformed(item) })

The options are — honestly — overwhelming. But remember, they’re all just functions.

As we transition from arrays to functions, we’ll identify the most common functions used in React code.

Take it Home

Identify the function parts of the code we’ve working with since day one:

let items = ["Michael", "Jim", "Pam", "Dwight"];
items.map((item) => <li>{item}</li>);

Can you think of ways to express this with different kinds of functions? I’ve describe a couple here to prime the pump.