JavaScript Function Expressions

One of the more powerful, and often confusing, parts of JavaScript is function expressions. Almost every modern programming, as well as a scripting language, provides this programming feature called "function". In this chapter, you will gather information about various working and structure of functions.

What are the functions in JavaScript?

A function is a set of reusable code that can be called anywhere within the program you have made which further eliminates the need for writing the same code again and again. Also, it helps you to write the codes in a modular format. There are lot more features of functions that make it very popular. Another usage of functions is that it divides a big program into some small and manageable functions which also makes programmers easy to read and debug modules of codes.

There are two ways to define a function. These are:

  • by function declaration and
  • by function expression.

The first, function declaration, has the following format:

function functionName(arg0, arg1, arg2 …. argN) {

//function body

}

The function's name is followed by the function keyword, and in this method, the function's name is assigned. Mozilla Firefox, Safari, Google Chrome, and Opera all feature a non-standard name property on functions revealing the assigned name. This value is at all times equivalent to the identifier which immediately follows the function keyword:

//works only on Mozilla Firefox, Safari, Google Chrome and Opera Browsers

alert("Test");  // functionName

Another way for creating a function is by using a function expression. Function expressions have several forms. The most common is as follows:

var function_Name = function(arg0, arg1, arg2…. argN){

//function body

};

This prototype of function expression looks similar to a normal variable assignment. A function is produced and assigned to the variable function_Name. The newly created function is considered to be an anonymous function since it has no identifier after the keyword 'function'. Anonymous functions can also be sometimes termed as lambda functions. This means the name property is an empty string.

Function expressions act like other expressions and hence must be assigned before usage. The following causes an error:

sayHello();       //error - function doesn't exist yet

var sayHello = function(){

alert("Hello Test!");

};

Function Definition

Before using Function definition, programmers need to define the functions. The most ordinary way of defining a function in JavaScript is by using the 'function' keyword, followed by a unique name for the function then, a list of parameters (that might or might not be empty), and a statement block bounded by curly braces.

The basic syntax is given as follows:

<script type = "text/javascript">
<!--
function func_name(list-of-parameters)
{
//Set of statements
}
//-->
</script>

Calling a Function

In the below-mentioned program, the function is being called using a button. Pressing the button will call the function, and all the statements within the function block will get be executed.

<html>
<head>

<script type="text/javascript">
function print_Hello()
{
document.write ("Hi Karlos");
}
</script>

</head>
<body>
<p>Press the button for calling the user-defined function</p>
<form>
<input type="button" onclick="print_Hello()" value="CLICK ME">
</form>
<p> Try using different sentences and P tag is used to give paragraph. . . . </p>
</body>
</html>

Scroll Back to Top