DEV Community

Cover image for JavaScript Tutorial Series: Functions.
The daily developer
The daily developer

Posted on • Edited on

JavaScript Tutorial Series: Functions.

Functions are a fundamental component of programming and are necessary to create better and powerful software applications.

What is a function?

A function is a reusable block of code that can be used by other program elements that has the ability to accept input, process it, and produce an output. By enabling you to condense a piece of code into a self-contained unit, functions enable you to write more organized, modular, and maintainable code by allowing you to encapsulate a chunk of code into a standalone unit.

Function Syntax

The function keyword is used to define functions. It is then followed by the function name which will then be later used to call it, a pair of parentheses, and a pair of curly braces.

function myFunction(parameter1, parameter2) {
 //code goes here
}
Enter fullscreen mode Exit fullscreen mode

Let's break this function down to understand what each part is.

  • function: This keyword tells JavaScript that this block of code is a function.

  • myFunction: This is the function name, which as we mentioned before you can use to call it in the code.

  • parameter1, parameter2: Parameters are inputs which can be used to pass values into the function. some functions do not need parameters. Functions can have multiple parameters.

  • curly braces: are used to encapsulate your code inside the function and is where you write the logic.

Why use functions?

  • To avoid writing the same code repeatedly, you can create a function that will encapsulate that code and allow you to reuse it whenever you need it.

  • To divide your program's various components into logical units can help your code become simpler to maintain.

How to invoke a function

The () next to the function name is used to invoke a function. Let's take a look at an example.

function sum(x, y) {
 console.log(x + y);
}
Enter fullscreen mode Exit fullscreen mode

This function is named sum and takes two parameters x and y and prints their sum to the console.

This is how we call a function.

sum(5, 10); //15
Enter fullscreen mode Exit fullscreen mode

We've called the function and as you can see we wrote the name of the function followed by parentheses. This function prints to the console 15.

The numbers passed to the function are called arguments.

Return statement.

Functions usually have a return statement which stops its execution. Functions can return any type of value. Return statements make sure that a function is reusable, and simple to test. You can reuse a specific task or operation throughout your program without writing duplicate code by encapsulating it in a function that returns values.

We're going to use the example above with a return statement instead of console.log. This should be an easy example to understand.

function sum(x, y) {
 return x + y;
}

let addition = sum (6, 7);
console.log(addition); //13 
Enter fullscreen mode Exit fullscreen mode

The function sum returns the sum of the arguments passed when invoking a function. if we just invoke the function sum(6, 7); we're gonna see that it does not display anything in the console, that is because return does not output anything but is used to make a function reusable as previously mentioned.

In the next post we're going to talk about Scope.

Top comments (0)