函数中 给element的onclick属性赋值了一个闭包,闭包要访问element的id属性。闭包在js中也是对象,函数即对象。闭包会持有外部传入的变量,因此闭包持有了element对象,而element对象通过onclick属性持有了闭包,因此两个对象相互持有,造成内存泄漏。
与OC类比,OC中使用weak对象引用,来解决循环引用的问题,js中也有类似操作,例如:
因为var id是由赋值得到的,js的赋值操作是值或者引用的拷贝,并不持有对象。此时element持有闭包,闭包持有id对象,并未造成循环引用。
内存无法回收,造成内存泄露。js定时器不会被自动销毁,即它所占内存无法被自动回收,如果不回收清除定时器,它会一直占用内存资源,造成内存泄漏。定时器是一个应用十分广泛的线程工具,可用于调度多个定时任务通过后台线程的方式执行。做项目的时候遇到切换路由,vueComponent仍然存在内存中,不会被回收的问题。
还未找到解决方法,记录一下别人的解决方法:
我在项目中把存在全局对象的数据放到vuex中,destroyed的中销毁事件监听等,在win10的IE和Chrome内存平稳了,但是win7的IE还是存在问题……蒙圈了
win7的话,在created和mounted中声明的变量要手动置为null,长的表达式用变量存下来,用完清空,data中的东西在destroyed中设置为null,setTimeout在beforeDestroy中清除,很多东西要手动清,包括引入的第三方插件
最最重要的,如果数据庞大,不要用vue的双向绑定