What in the Func is a Function? Quick Overview

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.

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.

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 identifier and the parenthesis give space to define arguments, the arguments are undefined variables that take the value of whatever is passed into the parameters of the function when it is being called. This is way more obvious in strongly typed languages.

Example.

Returning Value

functions can represent the data they have constructed within their code block, this allows for us to call a function and store its value onto a variable, or to illustrate I will show how a function can be called within a function, this illustrates the fact that on execution the right-hand side of an expression is executed before the execution of assignment to the left-hand side.

When you first start programming in JS, “I feel”, it is extremely important to understand how a function is working and how it is interacting with the other data in your application, this has been an extremely glossed over, an overview of how functions work, but I hope it provides some clarity or maybe provides some sort of ah-ha moment.

Some amazing resources

Kyle Simpson’s book “You Don’t Know JS Yet”
https://rileygelwicks.gitbooks.io/you-dont-know-js/content/index.html

Coding Train YouTube Channel
https://www.youtube.com/watch?v=mrYMzpbFz18

Functional Programming Basics
https://www.youtube.com/watch?v=FYXpOjwYzcs

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store