Javascript Functions

Functions

In programming languages, a function is a reusable blocks of code that performs a particular task. Functions are the core of any programming language. Handling functions is an important skill when you learn any programming language. Especially in the case of Javascript, it is one of the most important thing to understand the dynamic nature of this language

Defining functions

Javascript functions are considered as first-class objects, because they can be manipulated like any other object in the language. Javascript functions can have properties and methods, also it can be passed as arguments

Each function in your JavaScript must be addressing it by a unique name for that particular page. Always use meaningful function names, so that when you see it being used later in your programming code. Function names are case sensitive, that is a function name "callMe" is not same as "callme"

Function Declarations:

Syntax

function functionName(parameters (optional)){
	FunctionBody
}

The parameter is optional, you can write function without any parameters.

Function without arguments

example

function greetings() {
	alert("Good morning");
}

Function with arguments

function findSum(a,b){
	alert("Sum is : " + (a + b));
}

Calling a Function:

You can call Javascript functions by simply call the function name.

function greetings(){
  alert("Good Morning");
}
greetings(); //just give the function name only

When you run the above code, it will alert "Good Morning".

Function Arguments (Function parameters)

In javascript you can pass pass any number of arguments while calling a function, no matter how many of them are listed. The parameters you pass to the function will captured inside the function and any manipulation can be done over those arguments. A function can take any number of arguments separated by a comma delimiter

Syntax

function functionName(parameter1, parameter2, parameter3){
	FunctionBody
}

Function with one argument

<script>
function greetings(name){
  alert("Good morning " + name);
}
greetings("John");
</script>

When you run the above code , it will alert "Good morning John".

Function with two arguments

<script>
  function findSum(a,b)
  {
    alert("Sum is : " + (a + b));
  }
  findSum(10,15);
</script>

When you run the above code , it will alert 25.

Using arguments as Array

If you don't know the parameters passes to the functions, there is still a way to call array methods on arguments.

<script>
function findSum()
{
  alert("Sum is : " + (arguments[0] + arguments[1]));
}
findSum(10,15);
</script>

Here also you will get the same result because arguments is an array, each argument you pass to the function is added in the "arguments" array.

How to find how many arguments passed in a function ?

Javascript provide an arguments array to store the number of parameters passed in a function, so we can use arguments.length to find out how many parameters passed to a function.

<script>
	function findSum()
	{
		alert("Total number of parameters : " + arguments.length);
	}
	findSum(10,15,25,30);
</script>

When you run the above code, it will alert "Total number of parameters : 4"

Return Values

Javascript functions have the ability to return a value from a function to the code that called it. Javascript uses the return statement to return a value from a function.

<script>
  function findSum(x,y)
  {
    var result = x+y;
    return result;
  }
  var sum = findSum(25,30);
  alert ("Sum is : "+ sum);
</script>

Javascript function can return only a single value. If you want to return more than one values, then you can use an array that contains all of the values as array elements and return it

Javascript Pre-defined Functions

Till now , you learned about the user defined functions. But there are many functions that are built into the JavaScript and available for you to use. Some of commonly used built in functions are listed below:

parseInt()
parseFloat()
isNaN()
isFinite()
encodeURI()
decodeURIComponent()
eval()

Sample usage of built in functions

parseInt()

The parseInt() function in Javascript parses a string value and returns an integer value.

<script>
  var str = "90"
  var num = 10;
  var sum =  str + num; //before use parseInt()
  alert ("Sum is : "+ sum);
  sum = parseInt(str) + num; //using parseInt()
  alert ("Sum is : "+ sum);
</script>

When you execute the code, first it will alert "Sum is : 9010" and after using parseInt(), it will alert "Sum is : 100"