Using JavaScript Variables and Built-In Functions

By - thau!

There are four rules for naming variables in JavaScript:
  1. The initial character must be a letter, an underscore, or a dollar sign, but subsequent characters may be numbers as well.
  2. No spaces are allowed.
  3. Variables are case sensitive, so my_cat is different from My_Cat, which in turn is different from mY_cAt. As far as the computer is concerned, each of these would represent a different variable--even if that's not what the programmer intended. (You'll see an example of this in the section 'alert()' on page 22.) To avoid any potential problems with capitalization, I use lowercase for all my variables, with underscores (_) where there would be spaces in ordinary English.
  4. You can't use reserved words. Reserved words are terms used by the JavaScript language itself. For instance, you've seen that the first time you use a variable, you should precede it with the word var. Because JavaScript uses the word var to introduce variables, you can't use var as a variable name. Different browsers have different reserved words, so the best thing to do is avoid naming variables with words that seem like terms JavaScript might use. Most reserved words are fairly short, so using longer, descriptive variable names keeps you fairly safe. I often call my variables things like the_cat, or the_date because there are no reserved words that start with the word the. If you have a JavaScript that you're certain is correct, but it isn't working for some reason, it might be because you've used a reserved word.

Arithmetic with Variables

Line Y in Figure 2-3 introduces a new variable called seconds_per_day and sets it equal to the product of the other three variables using an asterisk (*), which means multiplication. A plus sign (+) for addition, a minus sign (-) for subtraction, and a slash (/) for division represent the other major arithmetic functions.

When the browser finishes its calculations in our example, it reaches the end of the JavaScript in the head (Z) and goes down to the body of the HTML. There it sees two lines of HTML announcing that the page knows how many seconds there are in a day.

<h1>Know how many seconds are in a day?</h1> <h2>I do!</h2>
So now you have a page that knows how many seconds there are in a day. Big deal, right? Wouldn't it be better if you could tell your visitors what the answer is? Well, you can, and it's not very hard.

Write Here Right Now: Displaying Results

JavaScript uses the write() function to write text to a web page. Figure 2-4 shows how to use write() to let your visitors know how many seconds there are in a day. Figure 2-5 shows the page this code displays.
<html><head><title>Seconds in a Day</title>

<script type = "text/javascript">

<!-- hide me from older browsers

var seconds_per_minute = 60;var minutes_per_hour = 60;var hours_per_day = 24;

var seconds_per_day = seconds_per_minute * minutes_per_hour * hours_per_day;

// show me --></script></head><body>

<h1>My calculations show that . . .</h1>

<script type = "text/javascript">

<!-- hide me from older browsers

X	window.document.write("there are "); window.document.write(seconds_per_day); window.document.write(" seconds in a day.");

// show me -->

</script>

</body>

</html>

Figure 2-5: JavaScript's calculations

Line-by-Line Analysis of Figure 2-4

Line X in Figure 2-4 writes the words there are to the web page (only the words between the quote marks appear on the page). Don't worry about all the periods and what window and document really mean right now (I'll cover these topics in depth in Chapter 4, when we talk about image swaps). For now, just remember that if you want to write something to a web page, use window.document.write("whatever");, placing the text you want written to the page between the quotes. If you don't use quotes around your text, as in
window.document.write(seconds_per_day);
then JavaScript interprets the text between the parentheses as a variable and writes whatever is stored in the variable (in this case, seconds_per_day) to the web page (see Figure 2-6). If you accidentally ask JavaScript to write out a variable you haven't defined, you'll get a JavaScript error.

Be careful not to put quotes around variable names if you want JavaScript to know you're talking about a variable. If you add quotes around the seconds_per_day variable, like this:

window.document.write("seconds_per_day");
then JavaScript will write seconds_per_day to the web page. The way JavaScript knows the difference between variables and regular text is that regular text has quotes around it and a variable doesn't.

Come back next week when we continue with this chapter, and get into Strings, Functions and Alerts!

This chapter is excerpted from The Book of JavaScript, 2nd Edition: A Practical Guide to Interactive Web Pages, from No Starch Press.


Page 2 of 2

Previous Page
1 2
 

Make a Comment

Loading Comments...

  • Web Development Newsletter Signup

    Invalid email
    You have successfuly registered to our newsletter.
  •  
  •  
  •  
Thanks for your registration, follow us on our social networks to keep up-to-date