Introduction

You may already know what a function is.

function myFunction(arg1, arg2) {
	// do something
}

But there is so much nuance when it comes to functions.

Function types

There are two ways to define a function: through a declaration or an expression.

Function declaration (named function)

// declaration
function declaredFunction() {}

A function declaration is also more commonly called a named function.

One important difference between a declaration and expression is that function declarations are hoisted, meaning that they are loaded into memory at compilation.

sayHi() // function call works even though function declared later

function sayHi() { console.log('hi!') }

Function expression (anonymous function)

// expression
const expressedFunction = function() {}

A function expression is more commonly called an anonymous function. This is because you don’t name the function (see function() {}) and assign it to a variable const expressedFunction =.

Function expressions are not hoisted.

sayHi() // TypeError: sayHi is not a function

const sayHi = function() { console.log('hi!') }

sayHi() // this function call works

Arrow function

An arrow function is a type of a function expression.

const arrowFunction = () => {}

You may be wondering about the use cases between arrow and anonymous functions. Aside from the arrow function looking cooler and easier to write, there are differences. I’m not going to talk about it since it’s not in the scope of this guide, and you’ll rarely find yourself needing to differentiate between the two. But if you are interested, read it here.