9 Pitfalls of JavaScript

From nine JavaScript gotchas, here are nine pitfalls that JavaScript is prone to make mistakes. While not a very advanced technical issue, note that it will make your programming a little easier, known as making life easier. I will mix some comments on some pitfalls.

1. Last comma

As in this code, note the last comma, which should be good in linguistics (Python's similar data type dictionary, dictionary, is allowed). IE will report grammatical errors, but vague, you can only scan from thousands of lines of code with your eyes.

<script>

var theobj = {

City: "Boston",

State: "MA",

}

</script>

2. This reference will change

As this code:

<input type= "button" value= "gotcha!" id= "MyButton" >

<script>

var MyObject = function () {

This.alertmessage = "Javascript rules";

This. ClickHandler = function () {

alert (this.alertmessage);

}

}();

document.getElementById ("TheText"). onclick = Myobject.clickhandler

</script> is not what you want, the answer is not "JavaScript rules." When executing Myobject.clickhandler, the red line in the code, this reference actually points to a reference to document.getElementById ("TheText"). This can be solved:

<input type= "button" value= "gotcha!" id= "TheText" >

<script>

var MyObject = function () {

var = this;

This.alertmessage = "Javascript rules";

This. OnClick = function () {

alert (Self.value);

}

}();

document.getElementById ("TheText"). onclick = Myobject.onclick

</script> Essentially, this is the JavaScript scope problem. If you've seen it, you'll find more than one solution.

　　3. Identify thieves

Do not use the same variable name as the HTML ID in JavaScript. The following code:

<input type= "button" id= "Thebutton" >

<script>

Thebutton = Get ("Thebutton");

The </script>ie will report an undefined error for the object. I can only say: IE sucks.

4. string only replaces the first match

The following code:

<script>

var fileName = "This is a title". Replace ("", "_");

</script> in fact, the result is "this_is a title". In JavaScript, the first parameter of String.Replace should be a regular expression. So the right thing to do is this:

var fileName = "This is a title". Replace (//g, "_");

5. mouseout means Mousein.

In fact, this is caused by event bubbling. IE has MouseEnter and mouseleave, but not standard. The author recommends that you use a library such as Yui to solve the problem.

6,parseint is based on the system of

This is common sense, but a lot of people ignore the parseint. There is a second parameter that indicates the binary. For example, parseint ("09"), if you think the answer is 9, then it is wrong. Because, here, the string begins with 0, parseint handles it in octal, 09 is illegal in octal, returns False, and the Boolean value false is converted to a value of 0. Therefore, the correct approach is parseint ("09", 10).

7.for...in ... Will traverse all things.

There's a code like this:

var arr = [5,10,15]

var total = 1;

for (var x in arr) {

Total = total * Arr[x];

} It's working well, isn't it? But one day it quit, give me the value returned to a Nan, halo. I just introduced a library. It turns out that this library has rewritten the prototype of array, so that our arr does not have much of an attribute (method), and for...in ... would have traversed it. So this is more secure:

for (var x = 0; x < arr.length; × x + +) {

Total = total * Arr[x];

In fact, this is also an example of the harm that the prototype of the basic class of pollution can bring.

8 . Trap for event handlers

This is only a problem with an event handler that uses the properties of the object. For example, Window.onclick = Myonclickmethod Such code, which will make a copy of the previous Window.onclick event, but also may cause the content of IE leaked (sucks again). The author suggests using libraries to solve problems, such as using Yui, before IE has not supported the event registration of Dom 2:

YAHOO.util.Event.addListener (Window, "click", Myonclickmethod); This should also be a common sense issue, but novices may be prone to make mistakes.

9.Focus pocus

Create a new input text element and move the focus to it, which is supposed to be a natural code:

var newinput = document.createelement ("input");

Document.body.appendChild (Newinput);

Newinput.focus ();

Newinput.select (), but IE will error (sucks again and again). The reason may be that when you execute Fouce (), the element is not yet available. Therefore, we can defer execution:

var newinput = document.createelement ("input");

Newinput.id = "Thenewinput";

Document.body.appendChild (Newinput);

SetTimeout (function () {//Here I use closures to rewrite, if interested can compare the original

document.getElementById (' Thenewinput '). focus ();

document.getElementById (' Thenewinput '). Select ();}, 10); In practice, JavaScript traps are many, mostly due to the fact that the parser is not in place. These things are not generally seen in textbooks, but can only be shared by the experience of the developers. Thankfully, we live in the internet age, and many of the problems we encounter are generally found in Google.

9 Pitfalls of JavaScript