The address for this web page is:   www.crosswinds.net/~fishcaro/day_J4_more_data_types.htm
On to the next lesson!
Back to the COURSE SYLLABUS

J4. MORE ON DATA TYPES

In this lesson, the study of JavaScript data types is continued.

INDEX CARD #J4:

SPECIAL NUMERIC VALUES (J4a)

JavaScript uses several special numeric values.

When a number is larger than the largest representable positive number, then JavaScript returns the value as  Infinity . (Similar for  -Infinity .)

When a mathematical operation yields an undefined result or an error, then a special Not-a-Number value, printed as  NaN , is returned. For example, division of zero by zero yields NaN.

Here are two special constants:

  • the largest representable number is:   Number.MAX_VALUE
  • the smallest (closest to zero) representable number is:   Number.MIN_VALUE

STRINGS (J4b)

A string is the JavaScript data type for representing text; it is a sequence of zero or more characters enclosed within single or double quotation marks ( '  or  " ).

So, how can you get a single quote inside a string? Just use double quotes on the outside, like this: "Julia's book"

So, how can you get double quotes inside a string? Just use single quotes on the outside, like this: 'She said, "Hi!"'

Since HTML makes heavy use of double-quoted strings, and since JavaScript is often embedded within HTML strings, it is a good idea to get into the habit of using single quotes around JavaScript strings.

So, how can you get a single quote inside a single-quoted string? Just use the special JavaScript escape sequence  \'  (a backslash followed by a single quote), like this:  'Julia\'s book' 

(More on "escape sequences" on the next card.)

ESCAPE SEQUENCES IN STRINGS (J4c)

The backslash character (\) has special meaning inside JavaScript strings; it is used to represent characters that would not otherwise be representable within the string.

Here are some JavaScript escape sequences.
\b     backspace
\f     formfeed
\n     newline
\r     carriage return
\t     tab
\'     single quote; apostrophe
\"     double quote
\\     backslash
Note: If a backslash precedes any character other than those listed above, then the backslash is just ignored. For example, "\a" is the same thing as "a".

WORKING WITH STRINGS (J4d)

To "concatenate" strings means to put them together. The + operator is used to concatenate strings, like this:
"a" + "b"   produces the string   "ab"

To find the length of a string (i.e., the number of characters it contains), use the  length  property. For example, suppose that  string  is a string. Then,  string.length  is a number that contains the length of the string.

JavaScript strings are indexed starting with zero.
That is, the first character is said to be in position 0.
The second character is said to be in position 1.
The ith character is said to be in position i-1.

The  charAt  method is used to give the character at a given position. Thus, the first character of  string  can be extracted like this:
first_char = string.charAt(0);

Printable version of Index Card J4a

Printable version of Index Card J4b

Printable version of Index Card J4c

Printable version of Index Card J4d

WORKSHEET #J4:
In Netscape, bring up a JavaScript Interpreter Screen, as discussed in the previous lesson.
Type in each of the following, to explore numbers, strings, and boolean values.
PREDICT what you'll get in each case BEFORE you press enter!
Identify each value of x as either a number or a string.

  1. x = 1/0; document.write("The value of x is " + x + "<BR>");
  2. x = -1/0; document.write("The value of x is " + x + "<BR>");
  3. x = 1.7e308; document.write("The value of x is " + x + "<BR>");
  4. x = 1.8e308; document.write("The value of x is " + x + "<BR>");
  5. x = Math.sqrt(-1); document.write("The value of x is " + x + "<BR>");
  6. x = Infinity+2; document.write("The value of x is " + x + "<BR>");
  7. x = Infinity - Infinity; document.write("The value of x is " + x + "<BR>");
  8. x = Infinity*0; document.write("The value of x is " + x + "<BR>");
  9. x = 5e-324; document.write("The value of x is " + x + "<BR>");
  10. x = 4e-324; document.write("The value of x is " + x + "<BR>");
  11. x = 5e-325; document.write("The value of x is " + x + "<BR>");
  12. x = ''; document.write("The value of x is " + x + "<BR>");
  13. x = typeof(''); document.write("The value of x is " + x + "<BR>");
  14. x = ""; document.write("The value of x is " + x + "<BR>");
  15. x = typeof(""); document.write("The value of x is " + x + "<BR>");
  16. x = 3; document.write("The value of x is " + x + "<BR>");
  17. x = typeof(3); document.write("The value of x is " + x + "<BR>");
  18. x = "3"; document.write("The value of x is " + x + "<BR>");
  19. x = typeof("3"); document.write("The value of x is " + x + "<BR>");
  20. x = "Julia's book"; document.write("The value of x is " + x + "<BR>");
  21. x = 'She said, "Hi!"'; document.write("The value of x is " + x + "<BR>");
  22. x = 'a\bb'; document.write("The value of x is " + x + "<BR>");
  23. x = 'a\fb'; document.write("The value of x is " + x + "<BR>");
  24. x = 'a\nb'; document.write("The value of x is " + x + "<BR>");
  25. x = 'a\rb'; document.write("The value of x is " + x + "<BR>");
  26. x = 'a\tb'; document.write("The value of x is " + x + "<BR>");
  27. x = '\"this quote\"'; document.write("The value of x is " + x + "<BR>");
  28. x = 'a\\b'; document.write("The value of x is " + x + "<BR>");

These last few are a bit different, so look carefully!
  1. string="Car"+"ol"; document.write("The value of string is " + string + "<BR>");
  2. x = length.string; document.write("The value of x is " + x + "<BR>");
  3. x = typeof(length.string); document.write("The value of x is " + x + "<BR>");
Based on your work above, please answer the following questions:
  1. Did all of these work the way they were supposed to? If not, comment on those that did not seem to work.
  2. Between what two numbers is the LARGEST number that can be represented in JavaScript?
  3. Does JavaScript understand imaginary numbers? (Recall that the square root of -1 is the imaginary number "i".)
  4. Can the special number Infinity be used in arithmetic operations?
  5. What is the largest number that can be represented in JavaScript?
  6. Which number is smaller (closer to zero), 5e-324 or 4e-324? What number does JavaScript return for each?
  7. Which number is smaller (closer to zero), 5e-324 or 4e-325? What number does JavaScript return for each?
  8. Can you have an "empty" string; that is, a string with nothing in it?
  9. What do you suppose the "typeof" operator is used for?
  10. Can you tell, from JavaScript output alone, whether  3  is a number or a string?

  11. Create an HTML program with the following line of code:
    <A HREF="" onClick="alert('Thank you!')">Please click here.</A>
    Try out this code.
    Then, make the following alteration; does it still work? What is this teaching you?
    <A HREF="" onClick="alert("Thank you!")">Please click here.</A>


  12. Finally, create an HTML program with the following lines of code, to practice working with strings:
    <SCRIPT LANGUAGE="JavaScript">
    string1 = "abc";
    string2 = "def";
    string = string1 + string2;
    document.write("string = " + string + "<BR>");
    length_of_string = string.length;
    document.write("length_of_string = " + length_of_string + "<BR>");
    firstchar = string.charAt(0);
    document.write("first character is " + firstchar + "<BR>");
    secondchar = string.charAt(1);
    document.write("second character is " + secondchar + "<BR>");
    </SCRIPT>
    


ASSIGNMENT #J4:
(AJ4.1) Please continue with the tutorial located at:
http://www.pageresource.com/jscript/index2.htm
Work through the second part of the lesson titled:
Using Buttons for JavaScripts
This second part deals with making JavaScript "history" buttons.
Be sure that you can do all the following:
  1. Be able to write the JavaScript code for a "BACK" button that operates exactly like the "BACK" button on your browser, causing you to visit the URL (if any) that was visited immediately before the current one. Extending, be able to create a "BACK 2" button that sends you back 2 steps, etc.
  2. Be able to write the JavaScript code for a "FORWARD" button that operates exactly like the "FORWARD" button on your browser, causing you to visit the URL (if any) that was visited immediately before the current one. Extending, be able to create a "FORWARD 2" button that sends you forward 2 steps, etc.
  3. Discuss how "history.go(n)" can take the place of both "history.back(n)" and "history.forward(n)". How would you use "history.go(n)" to go forward 2 steps? Backwards 2 steps?
On to the next lesson!
Back to the COURSE SYLLABUS
© 2001 Carol J.V. Fisher    All Rights Reserved