The purpose of this series of lessons is to teach you how to program in JavaScript. The goal is to provide a programming tutorial that will be accessible to persons with no programming experience and will be equally useful to persons who already have programming experience using JavaScript or some other language.
In JavaScript and many other programming languages as well, literal values, variables, function calls, and operators are combined to create expressions. Expressions are combined to create statements. Statements are combined to create programs.
Therefore, we need to begin with the fundamental building blocks and work our way up from there. In particular, we need to learn about literal values, variables, function calls, and operators.
You learned something about function calls in an earlier lesson. We will learn about operators in a subsequent lesson.
This lesson will concentrate on literal values and variables.
Before we can do that, however, we will need to learn about the types of
data that JavaScript supports.
JavaScript recognizes and supports the following types of data:
JavaScript will automatically convert data from one type to another
on an "as needed" basis during script execution.
net = gross - 120 |
However, the distance in miles between your house and your friend's house is probably not an integer. It is what math teachers refer to as a real number. It does have a fractional part. For example, it may be 3.6 miles from your house to your friend's house. (If you believe that it is exactly 3 miles to your friend's house, you probably didn't measure it accurately enough.)
To understand the following material, you need to know a little about raising numbers to powers. If you don't know about that, I strongly urge you to find a high school algebra book and brush up on it.
We are accustomed to working with numbers designed according to the
base ten (possibly because we have ten fingers). We refer to this
as decimal notation. A number, such as 306, in decimal
notation, can be thought of in the following way:
346 = 3x100 + 0x10 + 6x1 |
Stated differently, 100 is ten raised to the second power, 10 is ten raised to the first power, and 1 is ten raised to the zero power (your high school algebra teacher should have told you that any value raised to the zero power is 1).
Note that the coefficients can take on any integer value between 0 and 9, or ten possible values in all.
You are not confined to number systems designed to operate on the base ten. You can learn to do arithmetic using a number system based on any value (but it may be a challenge in some cases).
While decimal notation is usually most convenient for humans, it isn't the most convenient for the inner working of computers. Modern digital computers use the base two instead of the base ten. This is often referred to as binary notation or the binary number system.
While it may not be immediately obvious, the number of possible coefficient values for any given base is the value of the base. We saw that the number of coefficients for the base ten is ten. Thus, the number of possible coefficients for the base two is two. We commonly use 0 and 1 as the symbols representing those coefficients.
The binary system is tedious and difficult for humans to work with. Relatively small values result in a large number of digits.
Over time, programmers have developed a couple of crutches to make it easier to work with internal computer data. Without attempting to explain why, let me simply say that in the early days of computers, a popular crutch was a number system based on eight, and commonly known as the octal number system. This system is rarely used today.
The second crutch which is in widespread use today is a number system based on sixteen. This is commonly referred to as the hexadecimal number system
A number in the hexadecimal system represents a series of coefficients, each having 16 possible values, multiplied by a series of powers of 16. The reason this is popular is because it is easy to mentally convert between base 16 to base 2. Thus programmers can easily convert between something that is relatively easy for them to handle and something that is easy for the computer to handle.
Since the coefficients can take on 16 different values, it was necessary
to invent some new symbols to represent the coefficients. The sixteen
symbols in common use are:
0 1 2 3 4 5 6 7 8 9 A B C D E F or 0 1 2 3 4 5 6 7 8 9 a b c d e f |
A literal decimal integer literal consists of a sequence of digits without a leading 0 (zero).
A leading 0 (zero) on a literal integer indicates that it is in octal.
A leading 0x (or 0X) indicates hexadecimal.
We already know that the decimal system allows the digits (0-9).
As mentioned above, hexadecimal integers can include the digits (0-9) and the letters a-f and/or A-F.
By now it should be obvious that Octal integers can only include the digits (0-7).
We will see examples of integer literals in a sample script later in
this lesson.
Typically these numeric values will include a decimal point which can occur anywhere in the number. They consist of a whole number part and a fractional part. These are often referred to as floating-point values.
Two different notations are often used in computer input and output to represent values of this type:
6258942.123 = 6.258942123E06 |
The example on the right shows the same value expressed in exponential notation (sometimes called scientific notation).
The interpretation here is that the actual value is the value shown to the left of the "E" multiplied by ten raised to the power shown to the right of the "E".
In this particular case, the value to the left would be multiplied by ten raised to the sixth power (one million) to obtain the actual value.
In JavaScript, a floating-point literal can have the following parts, some of which are optional:
A floating-point literal must have at least one digit and either a decimal point or "e" (or "E").
We will see examples of floating point literals in a sample script later
in this lesson.
A string must be delimited by quotation marks of the same type; that
is, either both must be single quotation marks or both must be double quotation
marks. Examples of valid literal strings follow:
"Dick Baldwin" 'Dick Baldwin' "First line \n Second Line" |
The following table lists the special characters that you can use in
JavaScript strings. In all cases, you prefix the character with a backslash
character.
Character | Meaning |
---|---|
\b |
backspace |
\f |
form feed |
\n |
new line |
\r |
carriage return |
\t |
tab |
\\ |
backslash character |
\" |
double quotation |
Variable names must conform to the naming rules for identifiers.
A JavaScript identifier must start with a letter or underscore ("_"). Following this, you can use either letters or the symbols for the digits (0-9).
JavaScript is case sensitive. Therefore letters include the characters "A" through "Z" (uppercase) and the characters "a" through "z" (lowercase).
When working with variables in JavaScript and other languages as well, you must always be concerned about an issue known as scope. Scope determines which statements in a program have access to a variable, and in some languages determine the lifetime of the variable.
In most languages, including JavaScript, you must declare a variable before you can use it. However, JavaScript is very loose in this regard. There are two ways to declare a variable in JavaScript:
By simply assigning it a value; for example, x = 10
Using the keyword var; for example, var x = 10
JavaScript recognizes two kinds of variables:
Local variables may only be accessed by other code within the same function. Global variables may be accessed by any code within the document. Special considerations apply when working with HTML frames. We will discuss these considerations when we study frames.
Using var to declare a global variable is optional. However, you must use var to declare a variable inside a function.
<!-- File Js00000070.htm Copyright 1998, R.G.Baldwin This JavaScript script is designed to illustrate the use of literals and variables of several different types. ----------------------------------------------------------> <HTML> <HEAD> <SCRIPT LANGUAGE="JavaScript1.2"> <!-- Hide script //Define the function named getArea() function getArea(theRadius) { var theArea;//declare a local variable //calculate the area theArea = 3.14159 * theRadius * theRadius; return theArea; }//end function getArea() // End hiding --> </SCRIPT> </HEAD> <BODY> <SCRIPT> var area;//declare a global variable area = getArea(3.1);//call the function with a float document.write("Area is: " + area + "<BR>"); area = getArea(5);//call the function with integer document.write("Area is: " + area); </SCRIPT> <P> Done. </BODY> </HTML> |
-end-