- Project I: A Simple Date Script
- Project II: A More Powerful Date Script
- Recap
- Advanced Projects
This chapter is from the book
This chapter is from the book
This chapter is from the book
Project II: A More Powerful Date Script
Although the simple date script above illustrated how simple it is to use a function that is built into a JavaScript object, this "fancy" script illustrates a more programmatic approach to generate a date on the fly: The approach outlined below can easily be customized so that you can generate a date that is laid out exactly the way you want.
Because this approach is flexible, it involves more code, which gives us an opportunity to examine some new features. The primary focus will be the three data types: numbers, strings, and arrays.
New Features
// (Comment)
Code tends to make sense to those who write it, while they're writing it. To others, or even to the person who wrote it a few months later, it starts to look like nonsense. Comments make it easier to share code with others. For example:
1. // For some reason, it's traditional to show people how to
2. // 'print' things by printing 'hello world'.
3. // In ASP, this is done using the Response.Write ( ) command
4. // (The Write method of the ASP Response object. This looks like:
5. Response.Write ("Hello World");
In the above example, lines 1–4 are commented out and are, therefore, ignored by the ASP interpreter. Line 5 is not commented; thus, it gets executed, so that the words "Hello World" appear in someone's browser.
Although I don't know where "Hello World" comes from,2 it seems like a sensible thing to say after spending too many days and nights in the artificial isolation of a computer screen. I know that I get a little disconnected, maybe a little disoriented, until it gets to the point where writing a script that says hello starts to seem downright social. I digress...
Number (JavaScript Data Type)
A number is an integer or real number that can be represented by a literal variable or as a literal:
9 // the number 9 3.45 // the number 3.45 3 + 2 // the number 5 number = 12 // the variable "number" has been set to 12 number + 2 // the number 15
String (JavaScript Data Type)
A string is a sequence of letters, numbers, spaces, and various other characters, which, like numbers, can be expressed literally or stored in a variable. For example:
"Hello World" // the archetypal string. "Tel: 805-966-0611" // another literal string. Name = "Wilbur" // a variable called name with a value // of "Wilbur"
Array (JavaScript Data Type)
An array is an ordered sequence of values:
(1,2,3) // the numbers one, two, and three
("Wilbur","Fred","Gordon") // three names.
name_array = ("Wilbur","Fred","Gordon") // a variable
// called name_array storing three names
Because arrays are ordered, it is possible to invoke a particular value in an array by referring to its index value:
name_array[0] // returns "Wilbur"
name_array[2] // returns "Gordon"
name_array[3] = "Becky" // name_array is now
//("Wilbur","Fred","Gordon","Becky")
Concatenation (JavaScript "+" Operator)
Concatenation makes it possible to make a single string out of two strings by "concatenating" them:
full_name = "jane" + " " + "doe" // full_name is //set to "jane doe"Note that in concatenating the strings "jane" and "doe" it was necessary to put a space between them (" ") to prevent the value of full_name being set to "janedoe".
Script 1-2date_fancy.asp
1. <%@ Language=JavaScript %>
2.
3. <HTML><HEAD><TITLE>Fancy Date</TITLE></HEAD>
4. <BODY BGCOLOR="#FFFFFF" >
5.
6. <%
7. var now, days, months, day_of_week_int,
day_of_month_int, month_int, year, today_date;
8. now = new Date();
9.
10. days = new Array ("Sunday","Monday","Tuesday",
"Wednesday","Thursday","Friday","Saturday");
11. months = new Array ("January","February","March",
"April","May","June","July","August","September",
"October", "November","December");
12. day_of_week_int = now.getDay();
13. day_of_month_int = now.getDate();
14. month_int = now.getMonth();
15. year = now.getFullYear();
16.
17. today_date = days[day_of_week_int] +", "+
months[month_int] + " " + day_of_month_int + ", " +
year;
18.
19. Response.Write (today_date);
20. %>
21.
22. </BODY></HTML>
This generates a date that looks like Figure 1-3.
){kind=link}
Figure 1-3 Now, this will really impress the folks back home
How the script works
1. Set default language to JavaScript.
2–5. Start of HTML document.
6. Open ASP tag.
7. This line declares the variables that we will be using with the JavaScript keyword var. Although not necessary, this is good practice (one that I'm not particularly good at...).
8. Initialize a new Date() object called now. By default, this object contains current date information.
10,11. Creates two arrays—one for days of the week and one for months. We'll need this because the weekdays and months are stored as integer values (0–6 and 0–11) in the now object that we've created.
12. Uses the getDay() method of the date object (now) to get an integer value for the day of the week. This assigns a value between 0 and 6 to the variable day_of_week_int.
13. Uses the getDate() method of the Date object to get an integer value for the day of the month. This assigns a value between 0 and 30 to the variable day_of_month_int.
14. Uses the getMonth() method of the date object to get an integer value for the month. This assigns a value between 0 and 11 to the variable month_int.
15. Uses the getFullYear() method of the date object to assign a four-digit value to year.
17. In this line, all of the information that we've collected so far is put together into a single string (today_date) that contains all of the date information. First, we use day_of_week_int to retrieve a single day of the week from the days array we created in line 10. For example, if day_of_week_int is 3, this returns "Wednesday." Then, the literal string ", " concatenates a comma and a space. We then use the same process to retrieve a month from the months array, concatenate a space, then the integer value stored in day_of_month_int (which is expressed as a number), throw in another comma and space, and end up with the four-digit year.
19. Using the Write() method of the Response object, the value in today_date is inserted into the HTML output by the script.
20. Closes the ASP tag. That's it for code.
21. Closes the HTML tags.