Objectives
Chapter 4: Debugging and Error Handling
After completing this chapter, the student will be able to:
- Recognize error types
- Trace errors with dialog boxes and the console
- Use comments to locate bugs
- Trace errors with debugging tools
- Write code to respond to exceptions and errors
Assignments and Due Dates
Assignments and Due Dates:
View
Required Sample Code
Completed sample code from Chapter 04 JS6eTextCode_Chapter04
Download the zip file and extract it.
The sample code prepared specifically for CS2513 CS2513ClassCode_Chapter04
- EventListeners.html
Call funtions to load header. nav, and footer when the window loads
Call multiple functions in an anonymous function
Supplemental Materials
- PowerPoint from Text: CS2513GosselinJS_CH4 -
View (ppt) | Print (pdf)
Software
Same software as previously indicated.
Chapter Questions and Test Reviews
Chapter Review Questions
Source for quiz and test questions. It is highly recommended that students know the answers.
Chapter 4: Review Questions (.rtf file)
Test 2: Review Sheet
Required Assignments
CSP04- Debug and Errors: Specifications (Complete, upload to Apollo1, then submit URL in the LMS)
Weekly Quiz: Chapter 4 (Located in the LMS)
Professor's Class Notes and Comments
Software such as Visual Studio (C++, VB, C#) incorporate great debuggers which alert the programmer to an error. Often they also provide the exact location as well as possible suggestions. This is not the case with JavaScript. Chapter 4 provides some tools such as the console debugger to assist with assuring code is error free.
One might be tempted to not devote a sufficient amount of time to the information related to the console debugger. As the course progresses and code becomes more involved you appreciate the effort that was made at this point in the course. As the saying goes "Pay now or pay later!"
Make it your goal this week to become proficient in debugging techniques that can be used for this course and all future JavaScript coding.
P. 271
The text provides an example of adding an event listener for errors. Now this may a raise a question about calling more than one function when a page loads. An option might be as shown below for SetUpPage() and CreateListeners(). The code for attachEvent() would be similar.
window.addEventListener("load",function(){setUpPage();createEventListeners();});;
Keep in mind that parameters can be passed to these functions using the following format.
Note: the following should be all on one line.
document.getElementById("btnListLength").addEventListener("click", function() {createList(document.forms[0].listLength.value);});;
Also keep in mind that when an element is going to be accessed more than one time, it might be wise to store the value in a variable. The last line of code could be modified as follows:
var buttonList = document.getElementById("btnListLength");
var listItemLength = document.forms[0].listLength;
buttonList.addEventListener("click", function() {createList(listItemLength.value);});;
This week's assignments will not cover all of the aspects of error handling. In Chapter 6: Enhancing and Validating Forms, the error trapping will receive additional attention.