在今天，JavaScript已经成为了网页编辑的核心。尤其是过去的几年，互联网见证了在SPA开发、图形处理、交互等方面大量JS库的出现。
如果初次打交道，很多人会觉得js很简单。确实，对于很多有经验的工程师，或者甚至是初学者而言，实现基本的js功能几乎毫无障碍。但是JS的真实功能却比很多人想象的要更加多样、复杂。JavaScript的许多细节规定会让你的网页出现很多意想不到的bug，搞懂这些bug，对于成为一位有经验的JS开发者很重要。
常见错误一：对于this关键词的不正确引用
我曾经听一位喜剧演员说过：
“我从未在这里，因为我不清楚这里是哪里，是除了那里之外的地方吗？”
这句话或多或少地暗喻了在js开发中开发者对于this关键字的使用误区。This指代的是什么？它和日常英语口语中的this是一个意思吗？
随着近些年js编程不断地复杂化，功能多样化，对于一个程序结构的内部指引、引用也逐渐变多起来
下面让我们一起来看这一段代码：
Game.prototype.restart = function () { this.clearLocalStorage(); this.timer = setTimeout(function(){ this.clearBoard(); }, 0); };
运行上面的代码将会出现如下错误：
Uncaught TypeError: undefined is not a function
这是为什么？this的调用和它所在的环境密切相关。之所以会出现上面的错误，是因为当你在调用 setTimeout()函数的时候, 你实际调用的是window.setTimeout(). 因此，在 setTimeout() 定义的函数其实是在window背景下定义的，而window中并没有 clearBoard() 这个函数方法。
下面提供两种解决方案。第一种比较简单直接的方法便是，把this存储到一个变量当中，这样他就可以在不同的环境背景中被继承下来：
Game.prototype.restart = function () { this.clearLocalStorage(); var self = this; this.timer = setTimeout(function(){ self.clearBoard();}, 0); };
第二种方法便是用bind()的方法，不过这个相比上一种要复杂一些。
Game.prototype.restart = function () { this.clearLocalStorage(); this.timer = setTimeout(this.reset.bind(this), 0); }; Game.prototype.reset = function(){ this.clearBoard();};
上面的例子中，两个this均指代的是Game.prototype。
常见错误二：传统编程语言的生命周期误区
另一种易犯的错误，便是带着其他编程语言的思维，认为在JS中，也存在生命周期这么一说。请看下面的代码：
for (var i = 0; i < 10; i++) { /* ... */ } console.log(i);
如果你认为在运行console.log() 时肯定会报出 undefined 错误，那么你就大错特错了。我会告诉你其实它会返回 10吗。
当然，在许多其他语言当中，遇到这样的代码，肯定会报错。因为i明显已经超越了它的生命周期。在for中定义的变量在循环结束后，它的生命也就结束了。但是在js中，i的生命还会继续。这种现象叫做 variable hoisting。
而如果我们想要实现和其他语言一样的在特定逻辑模块中具有生命周期的变量，可以用let关键字。
常见错误三：内存泄露
内存泄露在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);
如果运行上面的代码，你会发现你已经造成了大量的内存泄露，每秒泄露1M的内存，显然光靠GC（垃圾回收器）是无法帮助你的了。由上面的代码来看，似乎是longstr在每次replaceThing调用的时候都没有得到回收。这是为什么呢？
每一个theThing结构都含有一个longstr结构列表。每一秒当我们调用 replaceThing, 它就会把当前的指向传递给 priorThing. 但是到这里我们也会看到并没有什么问题，因为 priorThing 每回也是先解开上次函数的指向才会接受新的赋值。并且所有的这一切都是发生在 replaceThing 函数体当中，按常理来说当函数体结束之后，函数中的本地变量也将会被GC回收，也就不会出现内存泄露的问题了，但是为什么会出现上面的错误呢？