JavaScript Error handling and debugging

Source: Internet
Author: User

This article mainly introduces JavaScript Some common mistakes in the , and some of the basics for debugging and handling Errors , to help us improve JavaScript the quality of the code .

First , JavaScript Common in the 7 Kind of error :

1. variable not defined

The following statement implicitly creates a new variable ABC, and the value 123 assign to the variable :

<span style= "FONT-SIZE:24PX;" >ABC = 123;</span>

strictly speaking. , the variable should be explicitly defined :

<span style= "FONT-SIZE:24PX;" >var ABC = 123;</span>

( In fact , the use of the VAR keyword is related to the scope of the variable , so it's best to add a variable when you define it var Key Words )

but , If you use a variable that is not defined , will produce an error . For example , if the variable ABC no explicit or implicit definition in advance , The following statement produces an error :

<span style= "FONT-SIZE:24PX;" >alert (ABC);</span>

2. Case Sensitive

case error is one of the most common mistakes , but sometimes it's hard to find. . For example , find three errors in the following statement :

<span style= "FONT-SIZE:24PX;" >var myName = "Paul", If (myname== "Paul") {    alert (myname.touppercase ());} <span style= "font-family: Song body; Background-color:rgb (255, 255, 255); " > </span></span>

3. mismatched curly braces

4. mismatched parentheses

( The above two errors are similar , When the statement is too long will occur , Of course, these are also easy to find .)

5. missing plus sign (+) when connecting strings

This error is easy to find when the statement is short,but it's going to be a lot of trouble.,and different browser error alerts are not the same.forIEBrowser,Tips"error:expected (Missing Object)",and toFirefoxBrowser,the prompt"Missing;before statement (missing in the following statement;number)".

6. Assign values instead of equal

look at the code below. :

var mynumber = 99;if (mynumber=101) {    alert ("MyNumber is 101");} else {    alert ("MyNumber is" +mynumber);}

read the above code,are you trying toElsethe words in thealert ()method will be executed,and prompted us to "MyNumber is About"?but that's not the case .. IfThe error in the statement judgment is two equals(==)was written as a(=),The comparison operator(==)is written as an assignment operator(=).This is a very typical mistake.. JavaScriptand thevbdifferent,forvb,both assignment and comparison operations are an equal sign.This error does not produce an error message,so it's very easy to be overlooked ..What we want to remember is that,When the logic of the program is confusing and abnormal,can check if there's something wrong here..

Supplement :

Equal and congruent alert (1 = = ' 1 ');                        True, the equal pair is the value, type does not compare alert (1 = = = ' 1 ');                        False, congruent also needs to compare type alert (1 ==true);                The true,1 is implicitly converted to a Boolean value, true== Truealert (1 ===true);                The false,1 itself is a numeric value, and true itself is a Boolean

PS: In the case of unequal types, we recommend the use of congruent = = =

7. Mistake a method for a property, or mistakenly consider a property as a method

What is often done here is to forget to bring a pair of parentheses after the method name when using the method , or when you use a property , take extra parentheses after the attribute name . For example , the following code :

var nowdate = new Date;alert (nowdate.getday);

in the first row,used aDatethe constructor of the object,the constructor-Datean easy way to object,but,There is no pair of parentheses after the method name;in the second row,called theDateGetday of Objects()Method,but forget a

pair of parentheses .

The correct code is as follows :

var nowdate = new Date (); alert (Nowdate.getday ());

Error handling

1.try...catch Statement

Try...catch statements always appear in pairs.

The meaning of Try-catch

1. You can correct the error by modifying the code, do not need to use Try-catch

2. Browser compatibility issues can be judged by judging the browser or whether a property or method is supported, without the need for Try-catch

For example, if the code cannot be modified, an error may occur, this time with Try-catch, the network is interrupted

try {alert (innerwidth);                        W3c}catch (e) {alert (document.documentElement.clientWidth);                        IE}

PS: This does enable compatibility issues, but is logically incorrect . because Innerwidth does not support the browser, may not necessarily be ie .

// throws an error, stating that we cannot solve it ourselves, we need to report the error

try {new10;} catch (E) {if (einstanceof TypeError) {thrownew TypeError (' type error: An error may have occurred when instantiating new!) ');} Else{//alert (e);                        This behavior is called processing error, the browser does not hold the wrong, because it has been disposed of, shielding the error display thrownew errors (' Unknown error! ');}} NEW10;                        

Script Debugger

JavaScript Error handling and debugging

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.