DEV Community

cmleary
cmleary

Posted on • Updated on

The Reality of Functions

If you are going to code you are going to learn and get used to utilizing functions. Functions are a major part of how you as a programmer will have the labor to be cut down to possess as little of excess as it needs to be. In the majority of our work as programmers there will most certainly be times when we have one task repeating and writing the same lines of code is simply inefficient. This is where functions will shine as you simply need to write the task to be completed once and if the task needs to be repeated then all you have to do is call the function again to repeat.
When it is broken down a function is a set of code that does not act until it is called upon, whether it be to do simple arithmetic or to create elements in a DOM as long as it is properly set up the function will complete the task as many times as needed. Without using functions our code will be oversaturated with repetitive lines and similar variables that will most likely create a program that is a headache to maintain and just unappealing to look at.
For a basic show of what a function can do let’s look at a function that receives parameters that are numbers to go through several forms of operations and prints out the results:

function arithmetic(num1,num2){
  let sum = num1 + num2
  console.log(sum)
  let product = num1 * num2
  console.log(product)
  let difference = num1 - num2
  console.log(difference)
  let quotient = num1 / num2
  console.log(quotient)
}

let a = 7
let b = 5
let c = 4

arithmetic(a,b)
arithmetic(b,a)
arithmetic(c)
Enter fullscreen mode Exit fullscreen mode

Now let’s break down what is happening here to understand the basics. As programmers one of the first things we are taught is that code runs top down meaning the first line of code should run as if one was reading a book. However, here the first line read is the declaration of a function that performs several tasks but ultimately won’t perform them until the function is called which happens later on. So we skip the function and its contents and get to the variable declarations which we then enter into the function. The first time the function is called we set the parameters as variable a and b, the order here affects how the function performs the operations so entering the parameters correctly affects the entire process. So for arithmetic(a, b) parameter ‘a’ becomes ‘num1’ and parameter ‘b’ becomes ‘num2’. Then the code as it normally would and in the background it looks like this with the commented parts showing what would appear in the console log (also as written above variable a = 7 and variable b = 5):

function arithmetic(a,b){
  let sum = a + b           
  console.log(sum)                      //12
  let product = a * b
  console.log(product)                  //35
  let difference = a - b
  console.log(difference)               //2
  let quotient = a / b
  console.log(quotient)                 //1.4
}
Enter fullscreen mode Exit fullscreen mode

The next line of code in the example is arithmetic(b,a) similar as the first however the arguments are switched. In turn this would lead to the outputs as:

function arithmetic(b,a){
  let sum = b + a           
  console.log(sum)                      //12
  let product = b * a
  console.log(product)                  //35
  let difference = b - a
  console.log(difference)               //-2
  let quotient = b / a
  console.log(quotient)                 //0.71428571428
}
Enter fullscreen mode Exit fullscreen mode

When it comes to sum and product the result won’t particularly change however when we processed the difference and quotient due to the parameter change we received different results.
Now what would happen if we enter in only one parameter in this function even though it requires 2? In the next line of code we have arithmetic(c), where c is 4 in this example.

function arithmetic(c,num2){
  let sum = c + num2            
  console.log(sum)                      //NaN
  let product = c * num2    
  console.log(product)                  //NaN
  let difference = c - num2
  console.log(difference)               //NaN
  let quotient = c / num2
  console.log(quotient)                 //NaN
}
Enter fullscreen mode Exit fullscreen mode

As you can see we did not receive any proper results because there was no ‘num2’ for this entry. We only received ‘NaN’ which means ‘Not a number’ to show how we need to make certain we enter in the right amount of parameters.
And this will conclude a brief introduction to the usefulness of functions. In this case the function was set up to receive numbers and perform some simple arithmetic, however functions can also receive objects and arrays to manipulate them. These other manipulations can help order data and manipulate elements within a DOM. So as programmers it is important to take advantage of these tools to make our code perform all of its tasks in a concise manner.

Top comments (1)

Collapse
 
abdrzqsalihu profile image
Abdulrazaq Salihu

Absolutely fascinating topic! Diving into the reality of functions feels like exploring the heart of coding. They're the powerhouse behind modular and efficient programming