The JavaScript Diaries: Part 4 - Page 5

The JavaScript Diaries: Part 4

Return Statements

If you create a function and call it once, that works well, but what if you
want the function to carry out a task that can by reused within the main script
multiple times? JavaScript uses a "return" statement for this very situation.
The return statement must be on the last line of the function, before the closing
bracket. This is important as the execution of the function stops once a return
statement is encountered; anything after that is not processed.

Let's take a look at what is happening here. Remember, while the function is not executed until it is called, the code should be in memory prior to the function call to avoid any possible errors.

This script actually begins on the seventh line with the declaration of the variable alertText. It is initialized with the value of the function getAddedText.

At the same time, a function call is initiated and the function getAddedText is executed.

Two local variables are declared, textPart1 and textPart2,
and initialized with the values of "This is " and "fun," respectively.

A third variable, addedText, is declared and initialized with the values of the first two variables. The results are joined together ("concatenated").

A return statement is then issued, sending the value of the variable addedText back to the place in the script where the call was first made.

An alert window is then displayed with the result of the variable alertText. Remember, we had previously assigned the results of the function getAddedText to the variable alertText.

It's gets a little complicated but if you break it down into segments — which is what the JavaScript interpreter does — it's fairly easy to follow. Without a return statement, the function is only used when a function call is issued and then it ends. With a return statement, the results can be incorporated within the overall script and can be used several times.

Using the return statement in the function also allows the results to be further
manipulated outside the function, within the overall script. Let's use the above
example and make a few additions:

As I stated earlier, it's important to remember that the return statement
is placed in the last line of the function, before the closing curly bracket
as it stops all further processing of the function code. For example, in the
following code, the function stops calculating after the return statement. The
alert box will return a result of "undefined" as the function did not complete
its 'program,' Run it and see how it works.

Return statements are very valuable in validating user input, as in forms.
They also have many other uses.

Conclusion

That will wrap it up for our study of JavaScript functions. If you're like me, your head is probably still spinning a bit. Next time we'll look at conditional statements and loops. Remember, if you have any questions, feel free to