JavaScript error and debugging method detailed

In front-end development, unless a large team has strict logging control and error mechanisms for programming, the front-end use of errors and debugging in small teams is largely dependent on debugging tools such as Firebug. The short period of the front-end iteration time is also relatively short, in this respect is indeed a lack.

Reading the tenth chapter of "Writing maintainable JavaScript", "Throwing a custom error", has some inspiration for code writing and specification. Write down some useful things as notes.

Error type:

error– Basic Error type
evalerror– error thrown through the eval () function to execute code
rangeerror– When a number exceeds its bounds (example: Creates an array of negative indices)
referenceerror– The expected object does not exist
syntaxerror– syntax error in code passed to the eval () function
The typeerror– variable is not the expected type (new, ' prop ' in true)
urlerror– are often thrown when encodeURI (), encodeURIComponent (), decodeURI (), and so on pass the URI string in an illegal format.

On the application of Try-catch

• After fixing a bug that is difficult to debug and fix, try adding custom errors so that you can quickly locate the error code the next time you debug.
• Some defensive, predictive errors when writing code can try to add an error handler function.
• Code being written needs to be made available to others, and if you follow the other person's thinking, throw the error handling in a particular case
Errors and error handling are not intended to prevent errors, but rather to debug and locate errors more quickly when errors occur.

Cases

A Use the alert () and document.write () methods to monitor variable values

If you want to break the code and monitor the value of the variable, use the alert () method;

If you need to see a lot of values, use the document.write () method to avoid repeatedly clicking the OK button;

B using the Window.onerror event

When an exception occurs on the page, the OnError event is triggered on the Window object. It can tell developers a certain amount of error information.

Example:

The code is as follows	Copy Code
<script type= "Text/javascript" > function Myerror (_message,_url,_line) { Alert ("error message:" + _message + "n wrong uri:" + _url + "n Wrong number of rows:" + _line ); return true; Events for shielding Systems } Binding error Events Window.onerror = Myerror; Example of triggering error: Window,onload = test; </script>

Note: In IE, after the error event is triggered, the normal code will continue to run, all the variables and data will be saved, in its OnError event processing method can be normal access to, and in Firefox, triggered the error event, all the end, all the variables and data will be destroyed.

C use Try...catch statement to find errors

Example:

The code is as follows	Copy Code
<script type= "Text/javascript" > Try { Alert (triggering exception); } catch (_EX)//You can omit the "_ex" parameter { var err = "error message"; for (var i in _ex) { Err + + "n Parameter name:" + I + "T parameter value:" + _ex[i]; } alert (ERR); Print error } Finally//finally can be omitted ... { Alert ("Finally always runs"); } </script>

Note: Try...catch does not handle JavaScript syntax errors very well.

Example:

code is as follows	copy code
<script type= "Text/javascript" > Try { Alert ("Trigger syntax error")); More than half a ")" } catch (_EX)//can omit _EX parameter { var err = "error message"; for (var i in _ex) { Err + + "n Parameter name:" + I + "T parameter value:" + _ex[i]; } alert (ERR); Print error } </script>

The example does not enter a catch block.

D using the relevant debugger

In IE and Firefox browsers, you can use the relevant debugger or plug-in to debug JavaScript.

In the Firefox browser, you can use its own error console. Action steps are as follows:

Open the Firefox browser → in the menu bar "Tools" → select "Error Console".

In the absence of other plug-ins, its own "error console" is a very good choice.

In addition, in the Firefox browser, there are some very good debugger, such as: Venkman, Firebug and so on.

Venkman debugger installed, you can in the Firefox browser → in the menu bar "Tools" → Select the "JavaScript Debugger" command to enable;

Firebug debugger installed, you can in the Firefox browser → in the menu bar "tool" → select "Firebug" → select "Open Firebug" can be;

In IE browser, you can use the Microsoft Script Debugger Debugger

Microsoft Script Debugger is an IE plugin that Microsoft has released with IE 41 and can be downloaded free of charge from Microsoft's official website.

After downloading the installation, you must open the debug options for IE browser to use. Action steps are as follows:

1> open IE browser → Select the menu bar "Tools" → "Internet options" command → "advanced" tab → remove the tick in the Disable scripting Debugging (Internet Explorer) check box.

2> when IE browser is browsing the page, run the Microsoft Script Debugger Debugger tool to debug.