在用DOJO做单页应用的时候,我们常常会用到模板这个概念,也就是一个widget,里面封装了这个widget的所有属性和方法,在销毁这个widget的时候,会自动销毁其自身的和所有能通过widget.getChildren()获取到的子孙widget的相关资源(包括绑定的事件,参考文章Dojo 最佳实践 - 如何防止浏览器内存泄漏)。
最近在做一个画板widget的时候,发现通过gfx.createSurface()创建并附在这个widget的某个子节点里的时候,并不能通过myWidget.getChildren获取到这个画板对象,不由得在想那销毁这个myWidget的时候这个surface(包括其中的shape)和其中绑定的那些事件会被销毁否?
通过查看dojo官网的文档(gfx),发现surface和所有的shape都有destroy()方法:
,以及对于gfx的Destructors的描述:
这些表明了gfx创建的shape包括surface是有destroy()方法的,那在它的parentWidget被销毁时,有没有被调用了?假设在我们自己的模板中创建一个surface并添加一个lineshape
postCreate : function(){
this.surface = gfx.createSurface(this.canvasNode, "100%", "100%");
this.surface.createLine({x1:10,y1:10,x2:20,y2:20}).setStroke({color: "green", width: 2, join: "round"});
},
destroy: function() {
<span style="white-space:pre"> console.log("start destroy!!!");</span>
this.inherited(arguments);
//this.surface.destroy();
console.log(gfxregisty.byId("Line0"));
},
当myWidget被销毁时,调用destroy方法之后再firebug打印的结果如下:
,Line shape对象依然存在,如果我们把
//this.surface.destroy();
的注释去掉,再次执行销毁:
Line shape已经不存在了。
根据这个测试,我猜测在模板中创建的gfx对象,是不会被自动销毁的,需要我们手动去调用surface的destroy方法来进行销毁而不会造成内存泄露。
这个测试纯粹个人推论,不一定正确。欢迎大家一起来讨论。