JavaScript Programming Basics:

A Laboratory Series for Beginning Programmers

 
Alyce Brady
R.C. McDowell
Kelly Schultz

Department of Mathematics and Computer Science
Kalamazoo College
1200 Academy Street
Kalamazoo, MI  49071, U.S.A.


The JavaScript Programming Basics lab series presents elementary programming concepts using the JavaScript language. In particular, it introduces variables, functions and event handlers, conditions, loops, arrays, decision trees, sequential search, and selection sort. Students build three different web pages or programs: a guestbook, an "expert advice system" or decision tree, and a CD order form. These labs would be appropriate in courses on web page development, broad overview ("CS 0") courses, or elementary programming courses. At Kalamazoo College they have served as a supplement to an introductory computer science text by Decker and Hirshfield [1997].

Altogether, the module consists of 3 programming labs and 5 shorter "mini-labs" contained in 14 files, totalling less than 600KB.


Introduction

JavaScript has a number of features which make it appropriate for teaching programming to novices. It is a natural extension to web page development, allows students to do interesting things quickly, and introduces them to a syntax (C-like) and programming paradigm (object-oriented with event handling) that will serve them well as they learn other languages.

This series of labs presents elementary programming concepts such as variables, conditional statements, loops, and one-dimensional arrays, using the JavaScript language. The labs are meant to supplement instructor presentations, allowing students to apply new concepts through guided exercises. There are two categories of labs in the series.

Since the purpose of the mini-labs is the practice of new concepts immediately after they have been introduced, the instructions in the mini-labs are more detailed and explicit than those in the full-length labs.

Over the course of the lab series, students build three different web pages or programs: a guestbook, an "expert advice system" or decision tree, and a CD order form. In doing so, they experience both starting a program "from scratch" and modifying an existing program. The labs build on one another and are meant to be treated as a module, but it is possible to use just the labs associated with any one of the three programs provided that the educational prerequisites are met.

The module also includes two supplemental programming projects that extend the decision tree lab and the CD order form labs.

 

Educational and Equipment Prerequisites

The series does not assume any prior programming experience or specific mathematical background, but each programming lab does assume that students are familiar with certain topics. The first programming lab assumes that students have prior experience creating simple web pages and are familiar with basic HTML tags. The second programming lab assumes that students have been introduced to decision trees. The final programming lab assumes that students have seen the selection sort algorithm. The Notes for Instructors page provides more details about the pedagogical goals and prerequisites for each programming lab and mini-lab.

Viewing or printing the lab manual requires Adobe Acrobat Reader. Students completing the lab series should have access to an editor for editing web pages at the source level and a browser for viewing their results. These exist for all common platforms. Almost any editor and browser will do, since the lab series is intended for novice programmers and novice web page developers and so uses only the most basic features of HTML and JavaScript. Students with access to tools that understand JavaScript, though, will benefit from the extra clarity provided by features such as syntax coloring and improved error messages. For Programming Lab 1 you will also need to be able to install a CGI script where your students will be able to access it; see the Notes for Instructors page for more information.

 

List of Programming Labs and Mini-Labs

The programming and mini-labs are listed in the order in which students should complete them. The Notes for Instructors page provides more details about the pedagogical goals and prerequisites for each programming lab and mini-lab.

Guestbook Program

Expert System Program

CD Order Form Program

 

Acknowledgements

The labs in this series were originally developed in 1997 by Kevin Arnold and Andrew Seidl, working under the supervision of Alyce Brady, as an advanced student project. They were significantly revised by the authors from 1997 to 1999. Jason Atkins and Alyce Brady contributed the final revisions in 2001-2002. Our thanks to the anonymous reviewers for their helpful comments and suggestions.

 

References

BRADY, A., AND SCHULTZ, K. 1998. Using Web Page Development to Teach Programming Concepts. The Journal of Computing in Small Colleges 13 (5), 64-74.

DECKER, R., AND HIRSCHFIELD, S. 1998. The Analytical Engine: An Introduction to Computer Science Using the Internet. PWS Publishing Company, Boston, MA.