在 ExtJS 中销毁组件后引用变量会发生什么变化?

What happens to the reference variable after a Component is destroyed in ExtJS?

ExtJS 新手。我有以下代码。

var comp;
console.log('comp is - ' + comp);
comp = Ext.create('Ext.Component', {
    listeners : {
        beforedestroy : function(comp) {
            console.log('beforedestroy .. ');
        },
        destroy : function(comp) {
            console.log('destroy .. ');
        }
    }
});
console.log('comp is - ' + comp);
console.log('comp id is - ' + comp.getId());
comp.destroy();
console.log('comp is - ' + comp);
console.log('comp id is - ' + comp.getId());

chrome 的控制台输出是

comp is - undefined
comp is - [object Object]
comp id is - component-1009
beforedestroy .. 
destroy .. 
comp is - [object Object]
comp id is - component-1009

看起来即使在组件被销毁之后,变量仍然持有对原始组件的引用。我期望变量在销毁后具有未定义或 null 的值。这是正常行为吗?

您看到的行为与文档声称的一致。

Attempts to destroy any objects passed to it by removing all event listeners, removing them from the DOM (if applicable) and calling their destroy functions (if available). This method is primarily intended for arguments of type Ext.Element and Ext.Component, but any subclass of Ext.util.Observable can be passed in. Any number of elements and/or components can be passed into this function in a single call as separate arguments.

来源 - http://docs.sencha.com/extjs/4.2.1/#!/api/Ext-method-destroy

如果您查看源代码,它不会删除任何地方的实际组件。也就是说,调用 destroy 后组件将几乎无用,但这与被垃圾收集的对象不同。

Ext-JS 无法使您对现有组件的引用无效,因为 JavaScript 没有类似 C++ 的引用。

例如:

var a = {b:2};
var b = a;  
// a and b both reference `{b:2}`, there is nothing you can do 
// to `{b:2}` that would change a or b to be null

您可以使用未记录的 isDestroyed 属性.

检查组件是否被销毁
comp.isDestroyed // true

您还会注意到该组件已从注册表中删除

Ext.getCmp(comp.id); // undefined