【JS】js中内存泄漏有哪几种方式,如何避免

什么是内存泄漏？

本质上，内存泄露可以定义为：应用程序不再需要占用内存的时候，由于某些原因，内存没有被操作系统或可用内存池回收。编程语言管理内存的方式各不相 同。只有开发者最清楚哪些内存不需要了，操作系统可以回收。一些编程语言提供了语言特性，可以帮助开发者做此类事情。另一些则寄希望于开发者对内存是否需 要清晰明了。

JavaScript 是一种垃圾回收语言。垃圾回收语言通过周期性地检查先前分配的内存是否可达，帮助开发者管理内存。

内存泄漏用大白话来说就是：分配了指定的空间，既不能使用也不能被回收

常见几种内存泄漏的情况：

1、元素未被清理，页面中元素被移除或者替换，该元素存在的事件仍没被移除，此时就产生了内存泄漏问题

var a = document.getElementById('id');document.body.removeChild(a);// 不能回收，因为存在变量a对它的引用。虽然我们用removeChild移除了，但是还在对象里保存着#的引用，即DOM元素还在内存里面。

解决方式：将元素事件设为null，a = null;

2、定义全局变量

解决方式：使用 var let const 来定义变量。或者在js文件开头添加 ‘use strict'，开启严格模式。或者一般将使用过后的全局变量设置为 null 或者将它重新赋值，这个会涉及的缓存的问题，需要注意）

3、闭包（函数套函数，子函数引用了父函数的参数或变，并且被外部引用，形成不被释放的作用域，称之闭包）

// 闭包维持了 onclick 方法的内部变量，并且这个绑定在了 DOM 上。function bindEvent() {  var obj = document.querySelector("#DOM");  obj.onclick = function () { };};
// 解决方案1function bindEvent() {  var obj = document.querySelector("#xxx");  obj.onclick = onClickHandler;};function onClickHandler () {};
// 解决方案2function bindEvent() {  var obj = document.querySelector("#xxx");  obj.onclick = function () { };  obj.onclick = null;}

4、定时器

解决方式：当不需要interval或者timeout的时候，调用clearInterval或者clearTimeout

5、事件监听

解决方式：手动解除绑定：DOM.removeEventListener(callback)

6、console

控制台日志记录对总体内存内置文件的影响，也是个重大的问题，同时也是容易被忽略的。记录错误的对象，可以将大量的数据保留在内存中。
传递给console.log的对象是不能被垃圾回收，所以没有去掉console.log可能会存在内存泄漏