JS Clock, Calendar & Timer

Today is

         

This page contains a header script which defines the Date & Time variables and calculates and formats the present time and the time in seconds since the page was loaded. Since the present time and time since loading are dynamic variables (they are constantly updated), they are supplied to the page by the use of an HTML form. The calendar output, on the other hand, is a static variable (calculated once when the page is loaded) and may therefore supplied to the page using a separate SCRIPT tag pair

All variables in the script are calculated from the date object. A date object per-se is actually not dynamic. Each time (no pun intended) a date object is instantiated (that word again), it provides in numeric form, the date and time it was instantiated. To obtain the dynamic aspect, it must be constantly re-instantiated. This is obtained by the first line in function showtime(); var now = new Date(). These objects and all variables derived from them   (hour, minute, second, timeOn, timeValue, timerTime, and timerTimS)   are defined within that function and are all local to it. Specifically, that means each time the function is entered, they are created; their value is determined and stored; the form text windows are updated with the new values; and the variables and object destroyed upon leaving the function.

While "now" is being constantly updated within function showtime(), another object "now" exists. That is the global "now" that is created by the "new data()" constructor that is also in the header but outside the function definitions. All variables or objects created outside the function definitions are global (available to the entire run). That "now" and its derived variables   (dayMonth. month, year, and dayWeek)   are not destroyed until the page image in memory is destroyed. Although the objects have the same name, the are distinct objects. Java Script maintains this distinction by requiring that any reference to "now" that occurs within showtime() use the local object while any reference to it outside of showtime() use the global object.

The interesting item here is that to provide all outputs, both a global "now" and a series of local "now"s are needed. The Calendar cannot access the local object and variables (they do not exist when the calendar line needs them {it can be made to work if the SCRIPT tag pair is placed within the FORM tag pair}) and the clock and timer cannot use the global now since it never changes.

---

In addition to the scope and lifetime, there is one other item that may be of interest about global and local variables or objects. Use of a constructor (the keyword "new") initializes the object and assigns memory to it. In most systems, global objects / variables receive their memory from the memory heap (aka pool) while local objects / variables receive theirs from the stack.

---

The last item to be considered on this page is why the series of {IF..ELSE IF} conditionals was broken into a nested set of conditionals. If it is assumed that the page will be accessed the same number of times {N} each month, then the ones occuring in January will require a total of N tests and the ones occuring in November and December will require 11N tests. This gives a total of 71N tests over the entire year. Nesting the conditionals to 3 levels, increases the number of tests for the early months and decreases them for the later months. The result is a total that is less than half of the number above.



Contact Carl Paulson with questions,
or Visit my pages.