JavaScript Functions

Defining Functions

Javascript functions are defined using the key word "function" followed by its name and variables being passed to it in the following syntax:

function fname(value1,value2, ...)
{
   statement1
   statement2
   .
}

An example:

<HTML>
<HEAD>
<TITLE>A function definition</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!-- Hiding JavaScript
function listItems(itemList) 
{
   document.write("<UL>\n")
   for (i = 0;i < itemList.length;i++)
   {
      document.write("<LI>" + itemList[i] + "\n")
   }
   document.write("</UL>\n") 
} 
// End hiding JavaScript -->
</SCRIPT> 
</HEAD> 
<BODY> 
<SCRIPT LANGUAGE="JavaScript">
<!--
days = new Array("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday")
listItems(days)
// --> 
</SCRIPT> 
</BODY> 
</HTML>



Calling Functions

If evaluate() is a defined function, the following line will call the function:

<SCRIPT LANGUAGE="JavaScript">
<!--
i3 = evaluate (Tree)
// -->
</SCRIPT>

This function may evaluate the members of the array tree to see how many match a certain criteria.

Another way to call a function is to tie it to an anchor:

<A HREF="javascript:redirectLink()">redirecting</A>

Another way is to tie it to an event:

<A NAME="javatest" onClick="redirectLink()">redirecting</A>

This will cause the redirectLink() function to run when the text "redirecting" is clicked on. The text inside the anchor reference is not marked as a link, nor does the mouse change when placed over the text. This is one way to make truly invisible links, that no one would know had any function until they click on it.

Functions Properties

Functions in JavaScript is actually an object. Therefore any created function created using the "function" declaration will have the properties of a function. These properties are:

  • arguments - An array of arguments passed to the function. This is an array object which has a property of length which enables the programmer to tell how many arguments (or variables)are passed to the function.
  • caller - The name of the function that called the function.
  • prototype - Used to make more properties.

Using the Arguments Array

The arguments array is a member of every function. It can be used to determine how many variables are being passed to the function, and what they are, without each argument being explicitly declared in the function. The following example performs the same task as the above example:

function listItems() 
{
   var items = listItems.arguments.length
   document.write("<UL>\n")
   for (i = 0;i < items;i++)
   {
      document.write("<LI>" + listItems.arguments[i] + "\n")
   }
   document.write("</UL>\n") 
} 

The function may be called as follows:

listItems("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday","Happyday")

Local variables

Local variables may be defined inside functions. The following example uses the variables, sum and items as local variables.

function average()
{
   var items = average.arguments.length
   var sum = 0
   for (i = 0; i < items;i++)
   {
      sum += average.arguments[i]
   }
   return (sum/items)
}
document.write(average(6,9,8,4,5,7,8,10))

Return

As in the example above, the return statement will return a value to the statement that invoked the function. In the above example, the average value is written to the document. The return statement will return the value as float, string, integer or whatever is appropriate for use.