javaScript 中常见的10种错误

1 对于this关键词的不正确使用

Game.prototype.restart = function () {
this.clearLocalStorage();
this.timer = setTimeout (function() {
this.clearBoard();
}, 0);
};

运行上面的代码将会出现如下错误：

uncaught typeError：undefined is not a function

为什么会有这个错？ this是指代当前对象本身，this的调用和它所在的环境密切相关。上面的错误是因为在调用setTimeout函数的时候，实际调用的是window.setTimeout，而在window中并没有clearBoard();这个方法；

下面提供两种解决的方法。
1，将当前对象存储在一个变量中，这样可以在不同的环境被继承。
Game.prototype.restart = function() {
this.clearLocalStorage();
var self = this;
this.timer = setTimeout(function(){
self.clearBoard(); }, 0);
}; //改变了作用的对象
2，使用bind()方法， 不过这个相比上一种会复杂，bind方法官方解释: msdn.microsoft.com/zh-cn/library/ff841995
Game.prototype.restart = function () {
this.clearLocalStorage();
this.timer = setTimeout(this.reset.bind(this)),
};
Game.prototype.reset = function() {
this.clearBoard();
};

2 传统编程语言的生命周期误区

在js中变量的生存周期与其他语言不同，举个例子
for (var i=0; i<10;i++){
/* */
}
console.log(i); //并不会提示 未定义，结果是10
在js中这种现象叫：variable hoisting(声明提前)
可以使用let关键字。

3 内存泄漏

在js中无法避免会有内存泄漏，内存泄漏：占用的内存，但是没有用也不能及时回收的内存。
例如以下函数：

var theThing = null;
var replaceThing = function() {
var priorThing = theThing;
var unused = function() {
if (priorThing) {
console.log(‘hi’);
};
};
theThing = {
longStr: new Array(1000000).join(‘*’),
someMethod: function () {
console.log(someMessage);
}
}
setInterval(replaceThing, 1000);

如果执行这段代码，会造成大量的内存泄漏，光靠garbage collector是无法完成回收的，代码中有个创建数组对象的方法在一个闭包里，这个闭包对象又在另一个闭包中引用，，在js语法中规定，在闭包中引用闭包外部变量，闭包结束时对此对象无法回收。

4 比较运算符

console.log(false == ‘0’); // true
console.log(null == undefinded); //true
console.log(” \t\r\n” == 0); // true
console.log(“” == 0); //true
if ({}) // … true
if ([]) // …. true

以上就是比叫容易出错的地方，还有强制类型转换等；有一个类型比较例外：NaN 及和自己不等，也和其他值都不等。只能用isNaN()来做判断。

5 低效的DOM操作

js中经常进行这些DOM操作，如何有效的进行是个难题，可以使用document.fragments：

var div = document.getElementsByTagName(“my_div”);
var fragment = document.createDoucmentFragment();

// elems 就是要添加的元素，，比如可以将这些元素放在一个对象数组中，及elems

for (var e = 0; e< elems.length; e++) {
fragment.appendChild(elems[e]);
}
div.appendChild(fragment.cloneNode(true));

这样做可以减少很多次DOM操作；

6 在for循环中的不正确函数使用

例如：这是一个典型的错误

var elements = document.getElementsByTagName(‘div’);
var n = elements.length;
var makeHandler = function(num){
return function() {
console.log()
}
}