C01—JavaScript Exercises
(CISC474 Spring 2007)

What I'm looking for here is some labs that can be used in CISC103, which is an introductory programming class taught using JavaScript as the intro programming language. This gives you an opportunity to really learn JavaScript, since you cannot explain something to a beginner well unless you first understand it well yourself.

Each lab you generate, depending on the quality of the lab produced, is worth between 30-50 points. With extra point opportunitites (as listed below), you can increase this to up to 90 points per lab.

My purpose is two fold:

  1. Educational for you: by thinking through a problem in JavaScript and how to solve it, you are learning JavaScript, and demonstrating that learning.
  2. (Full disclosure...) Selfish for me: you are helping me build up a collection of lab assignments that I can use in CISC103 in the fall.

Some background

CISC103 is a intro programming course that should accomplish all of the following goals

  1. Teach students XHTML and CSS skills they can use to build web pages. Other courses (including ART307 and ENGL418) teach web page design, but do so at a "high level", and don't get as much into the technical details of XHTML and CSS.
  2. Teach students JavaScript skills they can use to build web pages
  3. Teach students basic concepts of programming and Computer Science so that, if they want to, they are prepared to move on to CISC181.

Most textbooks on the market either

What I'm looking for

If you look at the following example labs from CISC103 (actual labs I used in Fall 2005), you'll get ideas about what I want. Each of these labs has a general pattern to it:

The general idea is if the student understands the concept (e.g. if/else or while or arrays), then the student can follow the model to come up with a solution to the problem.

Example labs:

Semester Assignment DIrectory with examples topics covered
05F activity03.html activity03/ window.prompt(), parseInt(), parseFloat(), assignment statements, document.write()
05F activity04.html activity04/ using XHTML forms to get values, using a button to run a function (i.e. and event handler), putting values into fields in a form.
05F activity05.html activity05/ for loops, using document.write() to produce a table
05F activity06.html activity06/ string concatenation, functions and event handlers


What you need to do

Choose some topics. Here are sample topics.

There are many other possibilities as well. The idea is to keep the material at a intro programming course level. However,also realize that the students need, at the end of the course, to be ready to move into CISC181, so you also need to challenge the students as well.

For more points

There are two ways you can increase the point value of these JavaScript exercises to you.

Incorporate use of the JavaScript command line interpreter (10-20 extra points)

One thing that you may notice is that there is an awful lot for a beginning programmer to try to deal with all at once—XHTML, the DOM, the event model, event handlers, not to mention the basics of learning programming! So, last Fall, I tried a different approach—using the JavaScript command line interpreter to help students begin to understand basic concepts of JavaScript interactively, separately from a web browser. The following two labs are examples of that approach.

06F lab09.html n/a using the JavaScript command line interpreter to understand JavaScript (without having to also deal with HTML at the same time)
06F lab10.html lab10/ Understanding how to combine a function defined in an external JavaScript file with an XHTML form

As you can see, lab09 (from 06F) introduces the JavaScript commmand line, and basic concepts of the language—but then there isn't much for the students to actually _do_. So here are some suggestions for what kinds of new labs you could create:


Borrow a CISC103 textbook, and reference it (10-20 extra points)

I have a limited number of CISC103 JavaScript textbooks (JavaScript and AJAX, Visual Quickstart Guide, 6th edition) that I can loan out—first come, first served. You will get 10-20 extra points per assignment if you carefully cross reference the content of your assignment with the content of the JavaScript textbook. That might take one of several forms:

One more thing...

It is ok to duplicate topics that are already covered in the four example labs that I supplied above. However, if you do, please do at least one "new" topic for each one that duplicates a topic already covered.

What to turn in...

You'll turn in a tar file. It should be structured very much like this directory on copland/strauss:


which is also available as:


except, there will be one more directory for each assignment.

For example, if you do three activities, your tar file will contain

activity01.html HTML file describing the assignment, similar to activity03.html, activity04.html, activity05.html, etc.
activity01 directory with code for sample solution, similar to activity03, activity04, activity05, etc
activity01.solution directory containing sample solution (what you would expect the students to do).
activity02.html same three files/directories for your second activity
activity03.html same three files/directories for your third activity

Follow the submission instructions carefully!

Prepare your submission EXACTLY with this structure, as either a gzipped tar file, or as a zip file. Do NOT use any other compression format, and do not submit your exercises in MS Word, or with some other directory structure. Submission that are not in the proper format may receive significant deductions, or even be rejected without a grade being assigned.

Valid XHTML 1.1 Valid CSS!