Introduction to Functions in JavaScript
Subprograms are designed to execute a task and this subprogram is termed as a function. ∙ They are objects, which are executed when they are called or invoked. Within a program, you pass some value in a function. They return a value, but in JavaScript, the function will return undefined, if you specify no return value in the function.
Types of function and their Syntax:
Function can be defined in different ways. Like:
Function declaration: A keyword called “function” followed by the name of the function is used to create a function declaration. While using it, you hoist the definition of the function which allows it to be used before it is defined.
Template of the same:
function name(parameters){
statement1
statement2….}
}
Function Expressions: It is used to define an anonymous function or a named function. An anonymous function is nothing but a function which does not have a name.
While using Function expressions, you don’t hoist the definition of the function, therefore; it doesn’t allow it to be used before it is defined.
Template of the same:
let name = function (parameters){
statement1
statement2….}
}
In the above template, we have set an anonymous function object equal to a variable.
Arrow Function Expression: It is used to make the syntax to write function expressions shorter. Function value is not created in an Arrow function.
let name = (parameters) => {
statement1
statement2….}
}
Parameters vs. Arguments:
While reading or learning about JavaScript, you would come across these terms i.e., Parameters and Arguments. Though you may see them being used interchangeably, they are distinct and have a major difference.
Parameters: A function gets completed by the usage of Parameters, they are the names created in the function definition.
We can pass up to 255 parameters while defining a function. They are written in simple brackets and separated by commas.
Here’s a template with two parameters—a & b:
const a = true;
const b = false;
function two (a, b){
console.log(a, b);
}
On the other hand, Arguments are totally different from Parameters. They are the values that a function receives from each parameter when the function is executed (invoked).
In the above example, true & false are the two arguments.
Invoking a Function:
To execute a function, we call it or invoke it. To invoke a function you write the function name, and follow it by an open and closed simple bracket: ()
An Example for it:
Firstly, let’s define a function named tutorial, and pass a parameter named, name into it. While executing the function, it will log the parameter back to the console.
function tutorial(name){
console.log(name);
}
Now, let’s invoke or call this function.
tutorial('ram');
// ram
In the above example, I have called my function with the name ram.
For the cases where function has no parameter: They can be invoked with an empty bracket i.e. () For example:
function tutorial2(){
console.log('name2’);
}
tutorial2();
// name2
Function Return:
Until and unless it is not defined or specified, a function in JavaScript returns undefined. An example to understand it better:
function tutorial(){};
tutorial();
// undefined
In the above example, we have called our function tutorial with no parameter, Therefore, it has returned undefined.
Now, we can use a return keyword followed by the value, to return a value in the function. For example:
function tutorial(){
return true;
};
tutorial();
// true
In the above example, we have told the function to return true, this is another way to invoke a function.
⮚ One more important theory of the return statement is that it doesn’t let the function execute and it stops it.
Let’s see an example where two statements are returned in the single function.
function tutorial(){
return true;
return false;
};
tutorial();
// true
The first return statement has stopped the execution of the function, therefore it has returned only true(the first return statement) and has not executed the followed return statements.
Function Objects:
∙ In general, Functions are nothing but objects.
∙ In JavaScript, an object is anything that is not a primitive type, i.e., which is not o a Boolean
o a Number
o a String
o Null or
o Undefined.
∙ In JavaScript, we are allowed to pass a function as a parameter into some other function; this shows the versatility of objects in JavaScript.
Higher-order Function: When a function returns a function or when a function is accepted by some other function as a parameter, it is called a higher-order function. For example: Array.prototype.filter and Array.prototype.map
Scope of JavaScript
JavaScript is an important technology to learn for new and modern developers. The fact that 94.5% .of all the websites are built on JavaScript, shows how important is this technology.
Importance of JavaScript Functions
- It allows you to implement client-side scripts and server-server scripts. It simplifies the development of application.
- It makes web pages design responsive.
- It has ample number of frameworks and libraries.
- It gets evolved with market needs.
- It makes the page dynamic
- It gives a better user experience.
- Applications made on JavaScript can be used offline; all you need to do is sync your data once the system goes offline.
Conclusion – Functions in JavaScript
JavaScript is considered as an important tool for web development. This technology doesn’t seem to have an expiry date. Its specialty to provide responsiveness, interaction between client and server, ample libraries and frameworks etc. makes it unique. Its portability and efficiency makes it a good choice for complex application development. Day by day this technology is evolving with good pace and therefore increasing its users.