Functions are one of the main parts of computer programs.
They are widely used and are one of JavaScript's fundamental building blocks.
In this article, we'll go over the definition of functions and why they are so important. I'll also show you how to get started writing functions in JavaScript.
Let's dive in!
What is Function in Javascript
A function is a block of code that encapsulates one isolated, self-contained behavior for the computer to perform.
Functions are a set of of organised instructions that correspond to a certain task or specific functionality a user wants to implement in their program to achieve a single desired outcome.
The code inside a function runs only when it is needed, meaning only when it is called.
Functions are an important and useful part of programming because they create reusable code.
Instead of copying, pasting, and repeating the same code throughout different parts of your program, you can write that code only in one place using a function. Then you can use it over and over again whenever you have to.
This also helps when you want to implement changes to your program or debug and try to fix an error.
How to declare functions in Javascript.
The general syntax for creating a function in JavaScript is in this form:
function name(parameter1,parameter2,...) {
// the code statements to be executed
}
Let's break it down:
You declare a function with the function keyword. Next, you give the function a name of your choosing. Function names in JavaScript are case sensitive and a convention and best practice is to use camelCase. The function name is followed by a set of opening and closing parentheses. Functions are able to take in data by taking inputs. These inputs are enclosed in the parentheses and are called parameters.
Parameters act as local placeholder variables for the values that will be passed into the function as inputs when the function is called. They are entirely optional and if there is more than one, you separate them by a comma.
Lastly comes the curly braces, and inside them the main body of the function with the code statements to be executed when the function is called. This is where the inputs to the function are processed.
How to declare and call a simple function in JavaScript
function greeting() {
console.log('Hello World!');
}
Above, a function called greeting was created.
This function is a very basic one and you can't do much with it. It doesn't take in any inputs and the only thing that happens is the text Hello World! gets printed to the console.
Defining a function in and of itself doesn't run the code inside the function's body. For the code to be executed, and in order to see that message in the console, the function has to be called. This is also known as a function invocation.
To call a function that doesn't accept inputs, you just write the function's name followed by parentheses and a semicolon at the end.
greeting();
//output
//Hello World!
How to declare and call functions with parameters in JavaScript
We can modify the previous example to take inputs. We'll do this with parameters, as mentioned earlier.
Parameters are values that you pass in to the function when the function is being declared.
function greeting(name) {
console.log('Hello ' + name + ' !' );
}
The function named greeting now accepts one parameter,name. That string is being concatenated (+) with the string Hello and an exclamation mark at the end.
When calling functions that accept paraemeters, you need to pass arguments in.
Arguments are values that you supply when calling the function and they correspond with the parameters that have been passed in the function's decalaration line.
Example:
greeting('Jenny');
//Output
// Hello Jenny !
The argument is the value Jenny and you can think of it as name = 'Jenny'. name, the parameter, is the placeholder variable, and Jenny is the value you pass in when you call the function.
Functions can accept more than one parameter and can also return data back to the user of the program:
function addNums(num1,num2) {
return num1 + num2;
}
The above code created a function named addNums that takes in two parameters – num1 and num2, separated by a comma.
The same way functions have inputs, they also outputs outputs
The function returns as its output the sum of num1 and num2. This means that it processes the two parameters, does the requested calculation, and returns the end value as a result back to the user.
When the function is called, two arguments have to be passed in since it accepts two parameters:
addNums(15,50);
//Output
// 65
// think of it as num1 = 15 and num2 = 50
Each time the function is called, you can pass in different arguments:
addNums(6,10);
// 16
addNums(7,15);
//22