clear() 与 dispose() 区别?
core-echarts.ts
334行:
class ECharts extends Eventful<ECEventDefinition>
1166行
clear()
1174行
dispose()
先判断内部属性_disposed是否为true,如果是true,代表当前实例已经销毁过了,那么在开发模式下就打印警告,接着终止后续流程。
如果是false,说明当前实例还没有被销毁,那么接下来就执行销毁的流程。
先把当前实例的标记为已销毁
this._disposed = true;
接着获取当前实例的容器 DOM
cosnt dom = this.getDom();
如果 DOM 存在,则移除DOM上的属性 _echarts_instance_
的值(实例的id)
if (dom) {
modelUtil.setAttribute(this.getDom(), DOM_ATTRIBUTE_KEY, '');
}
接着就是销毁当前实例上挂载的组件、图表视图;通过遍历,调用每一个组件、图表视图的disopose方法进行销毁;
const chart = this;
const api = chart._api;
const ecModel = chart._model;
each(chart._componentsViews, function (component) {
component.dispose(ecModel, api);
});
each(chart._chartsViews, function (chart) {
chart.dispose(ecModel, api);
});
在所有的views销毁后,接着销毁 zrender
// Dispose after all views disposed
chart._zr.dispose();
在所有附着物都销毁后,就断开实例上的属性的引用,回收内存。
// Set properties to null.
// To reduce the memory cost in case the top code still holds this instance unexpectedly.
chart._dom =
chart._model =
chart._chartsMap =
chart._componentsMap =
chart._chartsViews =
chart._componentsViews =
chart._scheduler =
chart._api =
chart._zr =
chart._throttledZrFlush =
chart._theme =
chart._coordSysMgr =
chart._messageCenter = null;
delete instances[chart.id];