Another important part of JavaScript coding is learning how to create and use functions.

You create a function by grouping together JavaScript statements.

The statements grouped in the function work together to perform a particular action.

The function won’t run until you tell your browser to run it.

This is known as calling a function.

Let’s take a look at how you create a function that will pop up an alert and then call it:

<script>
 function sayPassword() {
 alert("Password!");
 }
 sayPassword();
</script>

Functions always have to be written in the same way. Each part is an important instruction for your browser.

A JavaScript function needs:

The function keyword:

To define and create a function you have to use the function keyword.

A function name:

Then you need to give your function a name.

The name should be short and explain the action the function performs.

The name always ends with a pair of brackets.

Curly braces:

After the function name, you have to open a pair of curly braces { }.

All the statements you want to group together in the function have to go inside the curly braces { }.

Statements:

Statements form the body of your function.

You can use as many statements as you want and the block of code will run in your browser whenever you call the function.

A function call:

To call our function and run the block of code, you have to type the name of the function (including the brackets) followed by a semi-colon.

After you have defined your function, you can call your function anywhere in your < script > block.

JavaScript Built-in functions

As well as grouping together statements to create your own functions, you can also use functions that are built into your browser. A built-in function is an action your browser knows how to perform without you having to write any code. A programmer has already done the hard work for you.

All you have to do is give your browser the name of the built-in function and the information it needs to run. JavaScript has many built-in functions. You’ve already been using one in this mission: the alert function. To use the alert function, all you do is type “alert” and your browser pops up the alert box. Built-in functions save you time and let you do more complex things when you are programming.

JavaScript Functions and arguments:

To make a function perform a task, you sometimes have to give it a piece of information so it can run. When we put information inside a function, we say that we have passed our function an argument. You have been passing an argument to a function every time you have used the alert function. Let’s take a look at what an argument looks like:

alert("Access Denied!");

The information in brackets after the name of the function is our argument. Our browser needs the argument to know what text to display in the alert box. Without the argument, the alert function wouldn’t work properly. Arguments can be in the form of text, numbers or variables.

If you are passing your function a piece of text to use as an argument, it needs to be in double quotes (” “). If you are passing it the name of a variable, you just use the variable name without quotes, like this:

var cyberCriminal = "Dangerous cybercriminals!";
alert(cyberCriminal);

You can pass arguments to any kind of function. You might have wondered why function names and function calls always end with a pair of brackets. It’s so you can pass the function an argument. Keep reading to see how to do it.

 <script>
 function sayHello(name) {
 alert("Hello " + name);
 }
 sayHello("Bob");
</script>

In this piece of code we have created a function that will pop up an alert. We do this by adding an argument to our function. This kind of argument is called a parameter.

We then code an alert which tells our browser to pop up some text plus the argument. We then tell the browser the name to insert in the alert by putting it in the function call.

Related Posts:

Online JavaScript Compiler. Code on the go.
JavaScript Glossary – Functions