tutorial 7 debugging javascript section a basic debugging techniques n.
Download
Skip this Video
Loading SlideShow in 5 Seconds..
PowerPoint Presentation
Download Presentation

Loading in 2 Seconds...

play fullscreen
1 / 30

- PowerPoint PPT Presentation


  • 488 Views
  • Uploaded on

Tutorial 7 Debugging JavaScript Section A - Basic Debugging Techniques. Tutorial 7A Topics. Section A - Basic Debugging Techniques About debugging concepts How to interpret error messages How to trace errors with the alert() method How to trace errors with the write() and writeln() methods

loader
I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
capcha
Download Presentation

PowerPoint Slideshow about '' - oshin


An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
tutorial 7 debugging javascript section a basic debugging techniques

Tutorial 7 Debugging JavaScriptSection A - Basic Debugging Techniques

JavaScript Tutorial 7 - Debugging JavaScript

tutorial 7a topics
Tutorial 7A Topics
  • Section A - Basic Debugging Techniques
    • About debugging concepts
    • How to interpret error messages
    • How to trace errors with the alert() method
    • How to trace errors with the write() and writeln() methods
    • How to use comments to locate bugs
    • About additional debugging techniques

JavaScript Tutorial 7 - Debugging JavaScript

basic debugging techniques
Basic Debugging Techniques
  • Understanding Debugging
    • Debugging
      • Act of tracing and resolving errors in a program
    • Three types of errors
      • Syntax
      • Run-time
      • Logic

JavaScript Tutorial 7 - Debugging JavaScript

basic debugging techniques1
Basic Debugging Techniques
  • Understanding Debugging
    • Syntax errors
      • Occur when code is used that the interpreter doesn’t recognize
      • Examples:
        • Invalid or incorrect statements
        • Missing symbols (e.g., curly brace)
        • Incorrect spelling or mistypes
        • Using different case when referencing variables

JavaScript Tutorial 7 - Debugging JavaScript

basic debugging techniques2
Basic Debugging Techniques
  • Understanding Debugging
    • Run-time errors
      • Occur when interpreter encounters code it can’t handle
      • Examples:
        • Call to function that hasn’t been defined
        • Referencing a variable that hasn’t been declared
        • Division by zero

JavaScript Tutorial 7 - Debugging JavaScript

basic debugging techniques3
Basic Debugging Techniques
  • Understanding Debugging
    • Logic errors
      • Problems in the design of the program that prevent it from running as anticipated
      • Examples:
        • Performing one operation when another is intended
          • e.g., multiplying instead of dividing
        • Infinite loops

JavaScript Tutorial 7 - Debugging JavaScript

basic debugging techniques4
Basic Debugging Techniques
  • Error Messages
    • Error messages are generated by the JavaScript interpreter when it encounters a syntax or run-time error
      • Unfortunately  not with a logic error…
    • Information displayed in error messages:
      • Line number in document where error occurred
        • Referenced from first line of document
      • Description of the error

JavaScript Tutorial 7 - Debugging JavaScript

basic debugging techniques5
Basic Debugging Techniques
  • Error Messages
    • Example:

function missingClosingBrace() {

var message = “Function missing brace.”;

alert(message);

JavaScript Tutorial 7 - Debugging JavaScript

basic debugging techniques6
Basic Debugging Techniques
  • Error Messages
    • In IE versions higher than 4:
      • Must turn on error notification
        • Tools menu  Options  Advanced
        • In Browsing category:
          • Select “Display a notification about every script error”

JavaScript Tutorial 7 - Debugging JavaScript

basic debugging techniques7
Basic Debugging Techniques
  • Error Messages
    • In Netscape versions that support JavaScript 1.3 and higher:
      • Must turn on error notification
        • Tools and Tasks menu  JavaScript Console

JavaScript Tutorial 7 - Debugging JavaScript

basic debugging techniques8
Basic Debugging Techniques
  • Error Messages
    • Messages don’t always identify the actual problem
    • They should be used as a starting point for debugging
      • Don’t assume that the problem is only with the line number shown in the error message

JavaScript Tutorial 7 - Debugging JavaScript

basic debugging techniques9
Basic Debugging Techniques
  • Error Messages
    • Web browsers do not strictly enforce JavaScript syntax
    • Programs may run even though they contain bugs
    • Bugs may not be recognized consistently across different browsers

JavaScript Tutorial 7 - Debugging JavaScript

basic debugging techniques10
Basic Debugging Techniques
  • Error Messages
    • How to mitigate bugs in your programs
      • Always use good syntax
      • Be disciplined in your programming technique
      • Thoroughly test your program in all major browsers

JavaScript Tutorial 7 - Debugging JavaScript

basic debugging techniques11
Basic Debugging Techniques
  • Tracing Errors with the alert() Method
    • If unable to locate a bug using error messages
      • Must trace the code
    • Tracing
      • The examination of individual statements in an executing program

JavaScript Tutorial 7 - Debugging JavaScript

basic debugging techniques12
Basic Debugging Techniques
  • Tracing Errors with the alert() Method
    • alert() method
      • provides one of the most useful ways to trace a program
      • Process:
        • Place an alert() method at the point in the program where you think the problem is located
        • Move it as necessary through the code until the problem is identified

or

        • Place several throughout the program at one time

JavaScript Tutorial 7 - Debugging JavaScript

basic debugging techniques13
Basic Debugging Techniques
  • Tracing Errors with the write() and writeln Methods
    • Examine multiple values
      • Alternative to single value using alert() method
      • Create a list by opening a new window and using write() and writeln() methods to print values to it

JavaScript Tutorial 7 - Debugging JavaScript

basic debugging techniques14
Basic Debugging Techniques
  • Using Comments to Locate Bugs
    • Comment out lines that may be causing problems
      • Single statements
      • Groups of statements
    • Combine debugging techniques for more comprehensive approach

JavaScript Tutorial 7 - Debugging JavaScript

basic debugging techniques15
Basic Debugging Techniques
  • Additional Debugging Techniques
    • Checking HTML Tags
      • If JavaScript bug cannot be found using the techniques mentioned here:
        • Check HTML code for errors
          • Missing open/close brackets
          • Missing open/close tags
      • HTML bugs generally aren’t announced

JavaScript Tutorial 7 - Debugging JavaScript

basic debugging techniques16
Basic Debugging Techniques
  • Additional Debugging Techniques
    • Analyzing your logic
      • If bug isn’t a syntax or run-time error:
        • Check logic
          • Analyze each statement on a case-by-case basis
          • Use tracing to ensure values of variables at specific points in the program

JavaScript Tutorial 7 - Debugging JavaScript

basic debugging techniques17
Basic Debugging Techniques
  • Additional Debugging Techniques
    • Testing statements with JavaScript URLs
      • JavaScript URL
        • Used for testing and executing JavaScript statements without an HTML document or JavaScript source file
        • Syntax:
          • javascript:statement(s)
        • Enter into the browser Location or Address box

JavaScript Tutorial 7 - Debugging JavaScript

basic debugging techniques18
Basic Debugging Techniques
  • Additional Debugging Techniques
    • Reloading an HTML document
      • Web browsers can often fail to reload a document when directed to do so
      • Sometimes, you must,
        • Reload or refresh
        • Re-open page
        • Shutdown and reopen browser
        • Clear cache

JavaScript Tutorial 7 - Debugging JavaScript