Javascript内存泄露

常见的js内存泄露

1. 意外的全局变量

• JavaScript 处理未定义变量的方式比较宽松：未定义的变量会在全局对象创建一个新变量。在浏览器中，全局对象是 window 。
  例如：

splunker = "这是一个全局的splunker"

实际上生成了一个全局的splunker，虽然一个简单的字符串，无伤大雅，也泄露不了多少内存，但是我们在编程中尽量少的避免全局变量！

• 另外一种全局变量可能由this创建。
  例如：

function foo() {
    this.variable = "potential accidental global";
}
// Foo 调用自己，this 指向了全局对象（window）
foo();

2. 没有及时清理的计时器或回调函数

setInterval用多了，会占用大量的内存。因此setInterval我们必须及时清理！
可以分别用如下方式清理setInterval

function b() {
    var a = setInterval(function() {
        console.log("Hello");
        clearInterval(a);
        b();                
    }, 50);
}
b();

或者用2个函数：

function init()
{
    window.ref = window.setInterval(function() { draw(); }, 50);
}
function draw()
{
    console.log('Hello');
    clearInterval(window.ref);
    init();
}
init();

或者我们用setTimeout

function time(f, time) {
    return function walk() {
     clearTimeout(aeta);
        var aeta =setTimeout(function () {
            f();
            walk(); 
        }, time);
    };
}
time(updateFormat, 1000)();

3. 脱离 DOM 的引用

有时，保存 DOM 节点内部数据结构很有用。假如你想快速更新表格的几行内容，把每一行 DOM 存成字典（JSON 键值对）或者数组很有意义。此时，同样的 DOM 元素存在两个引用：一个在 DOM 树中，另一个在字典中。将来你决定删除这些行时，需要把两个引用都清除。

var elements = {
    button: document.getElementById('button'),
    image: document.getElementById('image'),
    text: document.getElementById('text')
};
function doStuff() {
    image.src = 'http://some.url/image';
    button.click();
    console.log(text.innerHTML);
    // 更多逻辑
}
function removeButton() {
    // 按钮是 body 的后代元素
 document.body.removeChild(document.getElementById('button'));
    // 此时，仍旧存在一个全局的 #button 的引用
    // elements 字典。button 元素仍旧在内存中，不能被 GC 回收。
}

4. 闭包

......

5. Echart不停调用导致内存泄露

不停的用setInterval调用echart，更新echart表格及地图数据，及时清理了setInterval，也会导致内存泄露
解决办法：

myChart.clear();
myChart.setOption(option);

但是你会发现，作用不大，那么如何处理呢？
我是如下做的：
第一次处理用

myChart.clear();
myChart.setOption(option);

后面用setInterval的时候，我是如下写的：

mapCharts.setOption({
    series: [{
        data: _this.convertData(mapdata)
    }, {
        data: _this.convertData(mapdata.sort(function (a, b) {
        return b.value - a.value;
    }).slice(1, 6)),
       }, {
        data: _this.convertData(mapdata.sort(function (a, b) {
        return b.value - a.value;
    }).slice(0, 1))}]
       },{notMerge: false, lazyUpdate: false, silent:false});

仅仅重新设置了series里面的数据，不是全部setOption(option)。