Online Documentation Server
Net technology
Web technology
Data bases
Other docs



Вся предоставленная на этом сервере информация собрана нами из разных источников. Если Вам кажется, что публикация каких-то документов нарушает чьи-либо авторские права, сообщите нам об этом.

Previous Table of Contents Next

This technique may seem to you very tedious and time-consuming and it is indeed. In some cases, you won’t have any other way to find the bug. These cases usually involve a value coming back as <undefined> or null. Check for incomplete object reference (missing the top-level parent), misspelling an object name, or accessing an undefined property.

Sometimes you are not aware that an object property has been changed. To look for such cases, use the following function to list all object properties in your alert box:

function listProperties(object, objectName) {
var message = “”
for (var i in object) {
 message += objectName  +  "." + i + " = " + object[i] + "\n"

You invoke this function with the object type (unquoted) and the name of the instance (quoted string).

Getting it Right the First Time

Some bug-preventing programming techniques are as valid for JavaScript as they are for any other languages, and they should always be used in order to prevent bugs in the first place. The lack of sophisticated debuggers in JavaScript only emphasizes the leverage you can get by using these techniques.

Build the Script’s Skeleton First

Build your script in a top-down fashion. Start laying down your HTML parts first, including all form definitions. After you have designed the page layout, you can start filling in the JavaScript portions. When beginning a function, repeat loop, or if statement, fill out the entire structure before entering any details. For example, suppose you want to define a function showProperties(). Enter first the following structure:

function showProperties(){

and then add the parameters and the for structure

function showProperties(object, objectName){
   var message = “”
   for ( ) {

and so on. This technique has two advantages. It assures you have the closing character always attached at the end of the structure, as well as aligning the indentations. If you want, you can prepare a file with all JavaScript structure templates to copy from and paste in your document. You can also use JavaScript editor applications as explained in Chapter 35.

Keep Testing While Developing

This technique cannot be overemphasized. Always test your code after an incremental development. Don’t write pages of code and only then test it. Test the script whenever you have a new feature, function, algorithm, or any other complete chunk that can be tested by itself. The edit-save-switch-reload sequence is relatively fast and not as painful as compiling the code all over again, although this technique is very useful in a compiled language development environment as well.

Evaluate Expressions Outside Your Source

Instead of printing variable contents via an alert box, it is much faster to evaluate certain expressions in an independent, isolated environment such as a separate document you write with a few text or textarea objects in it. You can also use the internal javascript: URL for testing out expressions. This technique is especially recommended for beginners who need to gain confidence in their knowledge of what different methods (such as string, math, and date) yield.

Test Your Functions Outside Your Source

The same arguments presented above for expressions are applicable to functions as well. It is much easier to debug a function in an independent, isolated environment than inside a complex scripted document. Develop your function in a separate document that includes the minimum number of user interface elements you need for the testing. Of course, you will find it more and more difficult to develop your functions in isolation, because they are usually tied to numerous objects in the original document. It will encourage you, though, to develop much more generalized functions that have fewer ties to the environment.

Testing Your Script

Writing JavaScript is development and should be treated as such when you come to test your piece of art. Management bodies of development projects often allocate 50% of the resources for testing. You should anticipate similar proportions in your own work plans.

Making a script robust for the World Wide Web audience is not an easy task and should not be taken lightly. You have to anticipate what the user can do at any point and make sure your code handles it correctly. You should not make any assumptions on either the sequence of operations the user is going to follow or the type of data the user is going to enter into forms. You should assume, on the contrary, that the user is not going to follow your instructions (accidentally or intentionally). The user will enter characters in numeric fields, and will fill the form bottom up. Your script should handle all weird and incorrect data, giving the proper feedback to the user. If a form field accepts character values only, give the user an error message. Make sure your script does not crash the system if the input is not valid. Specifically check for the following items:

  • Unexpected reloading. Check how it affects the relationship between frames.
  • Suspending a document loading. Does it affect your script?
  • Bad data. Does the script crash when the data is not valid?

Test your pages extensively and on as many browsers as you can. Users expect the same robustness from your script as from the most professional software published on earth.


In this chapter, we gave some tips for debugging JavaScript scripts. We first listed common error messages, and explained what they mean and how you can use them to find bugs. We also provided some manual debugging techniques, which are very important in JavaScript, because, in contrast to other languages, it does not come with a debugger.

Previous Table of Contents Next

With any suggestions or questions please feel free to contact us