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 learn about the structure of the JavaScript function and its various features.

What Is the Function in JavaScript?

A JavaScript function is a set of reusable code that can be called anywhere within the program you execute; it eliminates the need to write the same code over and over again. Also, it helps you write the codes in a modular format. "Functions" has a lot of features that make it very popular. Another use of "functions" is that it divides a large program into a few small and manageable "functions" that make it easier for programmers to read and debug modules of code.

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

The second way to create a function is to use a function expression. Function expressions have many forms. The most common are 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