What in the Func is a Function? Quick Overview

Anthony Johnson
4 min readJul 3, 2020
A Block.

A function in JS, and most languages, is a block of code that does something; it can take in data and spit out new creations based on what you feed it through its parameters “()”<-that thing.

To elaborate a little more, a function is a reusable block of code that can be used to perform different, wait for it, Functions, or “Jobs”, or “Tasks”. These jobs can range from restructuring data from an API call to returning a true-false value to rendering HTML on the DOM; functions are the building blocks of a web application in JS.

A Function comes in a few flavors, Function Declarations, Function Expressions, Arrow Functions

Function Declarations which are special functions that are lifted to the top of the “Scope Block” during the compilation of a JS file, so in laymen's terms, a Function declaration doesn't have to worry about being called prior to its declaration, because, in the compilation, it already been defined prior to code execution. (I'm trying to simplify complex topics, bare with me)

Example.

addTwo(2);
function addTwo(x)
{
console.log(x+ 2);
}
//4

On the other hand, Function Expressions and Arrow functions are variables that have been bound to a function, during compilation they are stored in memory as their Left-Hand-Reference, variable names, the compiler does not know what they are doing until after compilation. So, they are simply variables that have been pointed to functions, they can be reassigned and are not function objects themselves. Function expressions are pointers to Function Objects, whereas Function Declarations are Function objects. Confusing, I know.

Example.

addTwo(2);
addThree(3);
const addTwo = function(x)
{
console.log(x+2)
}
const addThree = (x)=>
{
console.log(x+3)
}
//ReferenceError: Cannot access 'addTwo' before initialization
//ReferenceError: Cannot access 'addThree' before initialization

Building a Function

a function declaration is made up of a function keyword, a name, two parentheses, and a set of curly brackets. the function keyword signifies that the following code is a function object, the name gives the function an…