Functions

📚 Table of Contents
Named Functions
Anonymous Functions

like variables, functions are super imprtant in programming
functions are how you write reusable code
a function is a block of code designed to perform a particular task
making code reusable doesn't just save you time so you don't have to write the same set of instructions over and over again (even though it totally does help that), it helps structure the code and break it down to smaller, manageable parts
in JavaScript functions can be called (or invoked) to execute the code it contains
functions can also be given inputs, called parameters. you will sometimes hear parameters be called arguments but arguments are technically what they're called when they are passed back into the function, if thats confusing don't worry about it yet but those words are often used interchangeably for function inputs
so, once you write the function, you call it to execute, probably passing in arguments. if your brain just went "wtf does that mean?", I got you
we've actually already seen this in our little intro exercise. the very first thing we did was call the console.log() function (which is built-in to JS) with the argument string "JavaScript is connected!"

console.log("JavaScript is connected!");

you always call functions by typing the function name and a set of parentheses () after the name. parameters or arguments are passed in by typing them inside the parentheses
a few more imports things to note before we start writing our own functions:
all functions need a return statement
- the return value is kind of the point of writing the function in the first place. if the purpose of a function is to add two numbers, you're gonna want to know what the sum is, that's the return
- when JavaScript reaches a return statement, the function will stop executing
another imprtant thing is that in JS, functions are first-class citizens, meaning they can be stored in variables, passed as arguments to other functions, and returned from other functions

Named Functions

ok, lets finaly get to it. there are a few ways to define functions. there are shorthand ways and specific ways to do specific things (like run asynchronously or creating a React component), but for now lets start with the classic way. these are called named functions
type the keyword function, then the name of your function, then the parentheses (), if your function is going to take parameters, they go in the parentheses (), then open up curly braces {} and inside your curly braces is where you write the function body (or your algorithm 😎)

function name(parameter1, parameter2) {
  // code to be executed,
}

sounds more complicated than it actually is, right?
I mentioned writing a function that adds two numbers before, lets write that one now:

function addTwoNums(num1, num2) {
  return num1 + num2;
}

in the next section, we will see it in action
you call (or use) your function by just typing the name and parentheses and passing in the necessary arguments if your function takes them

// call a function
functionName();
 
addTwoNums(2, 2);

if this is all brand new to you, do not worry about this yet, feel free to move along and come back to this later. you won't see anonymous functions in action until the array methods section
anonymous functions are fairly new to JavaScript, they were introduced in ES6 which came out in 2015, so this is considered modern JS
anonymous functions are "anonymous" because they don't need a name
also known as arrow functions, the syntax is to define your parameter and then make an arrow, =>, then use the curly braces the same way the named functions do for the body

(num1, num2) => {
  return num1 + num2;
};

something that is really cool is that if your body logic or expression is only one line, you can actually skip the curly braces and the keyword return, which looks pretty slick:

(num1, num2) => num1 + num2;

I think you hear them called arrow functions more than anon functions because the reality is they often do have names and the way you give an arrow function a name is by setting it to a variable. you will see this a lot

const addTwoNums = (num1, num2) => num1 + num2;

you could then call this function exactly how you would call it if it were a classic named function

addTwoNums(2, 2);