JavaScript From Beginner To Advanced: Part Two (JavaScript Functions)

In my previous article we learned about the basics of JavaScript. In this article, we will take a look how functions are declared and worked in JavaScript.

Introduction

A function is nothing but a block of reusable code. Like a variable, function can also be defined anywhere in your JavaScript code section. JavaScript function allows us to divide a big programming code into small and manageable program code, known as modular development. We can create single or multiple functions in JavaScript. In JavaScript, like other advanced programming language e.g. C++, C# etc., we can also define our own JavaScript function. We can call these functions for execution whenever we need. So function makes our code easily reusable and maintainable within our script.

Function Declaration

A function in JavaScript is declare using function keyword. A function keyword is a reserve keyword of JavaScript. In the below example I created a sample function and called it for execution. For example,

  1. function print()  
  2. {  
  3.     document.write(“Learning JavaScript.”);  
  4. }  
  5. // executes print function  
  6. print();  

In the above example, the function declaration started with the function keyword followed by function nameprint. In JavaScript function within parenthesis {} (body section) we can write our code for execution, it means what operation we want from this function.

Function with Argument

In JavaScript we can also create argument based function. These are variables, either numbers or strings, with which the function is supposed to do something and the output of the function depends on the arguments you pass in it. We can use as many arguments according to our requirement. e.g.

  1. function example(a,b) {  
  2.    document.write(a+b);  
  3. }  
  4. Example(“Learning”,”JavaScript”);   

The example above declares a function named example with two arguments (a, b) and calls it. The output of above example will be based on given argument. e.g. “Learning JavaScript”.

Returning a value:-

In JavaScript, like other programming languages, we can also return a value from function. If we want to return any value from function then we need to use return keyword followed by value what we want to return. The return is reserve keyword by JavaScript. e.g.

  1. function sum(a, b)  
  2. {  
  3.     //return value using return keyword  
  4.     return a + b;  
  5. }  
  6. //function whatever return, It will store into result variable.  
  7. var result = sum(2, 5);  
  8. //print this variable.  
  9. document.write(result);  

In the above example we declare a function named sum with comma separated two argument (a, b) and call it for execution. The output of above example will based on given argument. e.g. 7.

If a function does not return anything, its result will be a special value, known as undefined. e.g.

  1. function nothingToReturn()  
  2. {  
  3.     //nothing to be return  
  4. }  
  5. //try to get value from function  
  6. var result = nothingToReturn();  
  7. //print the value of result. It will be undefined.  
  8. document.write(result);   

Nested functions

In JavaScript we can also create a function inside the function, called Nested function. In nested function the inner/child function can access of all arguments and variables of outer/parent function. We can easily declare a function inside parenthesis (body section) of another function. e.g.

  1. function multiplication(a){  
  2.    return function(b){return a*b;}  
  3. }  
  4. document.write (multiplication(3)(2)); // Output will be 6   

The returned function (anonymous type function) is an inner function of method multiplication ().In above example the argument of outer function multiplication () is also available for the inner function, this type of process is known currying.

Immediately Invoked Function

Immediate functions nothing but just anonymous type function which will execute just after its declaration. This type of function is also known as self-invoking function. Anonymous function means a function which has no name identifier. e.g.

  1. (function () {  
  2.    alert(“Hi Welcome to C-Sharp Corner.”);  
  3. }());   

Constructors

When a function statement written with new keyword before a Function class and call it, it becomes a constructor that creates object of that Function class. e.g.

  1. functionName = new Function("function code should be written here");   

We can also create Function class constructor with argument. Argument might be one or multiple.All arguments should be comma separated.

  1. functionName = new Function("argumet1","anrgumet2","function code");   

This construct executes the code as a string. This type of function is much slower than anonymous functions. This types of function should be created and used when actually you really needed it.

Conclusion

We learned about JavaScript function and how to create and run it. This is my second article inthe series "JavaScript from Beginner to Advanced." In upcoming articles we will play around with the JavaScript object. Your valuable suggestions, comments and critiques are welcomed.

Read more articles on JavaScript: