在 类 上配置别名有什么需要?
What is the need of configuring an alias on classes?
我想知道为什么我们需要在 ExtJS 类 上配置别名?它有什么好处?
xtype
和 alias
用于从其他对象中获取对对象的引用,而不是自己实例化它们或将它们放入变量中。
因为 Ext.form.TextField
有一个 xtype
'textfield' 我们可以这样做:
items: [{
xtype: 'textfield',
autoWidth: true,
fieldLabel: 'something'
}]
像这样定义视图有很大的好处。通过这种方式,框架将 lazy load 对象。
以后也可以用Ext.ComponentQuery.query()
查询
例如:
Ext.create('MyApp.view.MyButton', {
xtype: 'mybutton',
.....
});
稍后在您的代码中,如果您这样做:
var buttonArray = Ext.ComponentQuery.query('mybutton');
更多信息:
https://www.sencha.com/forum/showthread.php?150577-Ext.define-xtype-vs-alias
http://docs.sencha.com/extjs/4.1.3/#!/guide/application_architecture
https://www.sencha.com/forum/showthread.php?29531-Form-inside-Accordion-inside-Window&p=138612&viewfull=1#post138612
第一个最简单但有价值的好处是您不需要输入可能很长的 class 名称,但是当您需要使用 class 时可以使用较短的别名。
假设我们需要在布局中使用上面的class
没有别名,我们需要输入:
Ext.create('Ext.container.Container',{
布局:'vbox'
,项目:[
Ext.create('MyApp.view.MyGridView',{
// 配置
})
]
});
Ext.create('Ext.container.Container',{
布局:'vbox'
,项目:[
Ext.create('MyApp.view.MyGridView',{
// 配置
})
]
});
使用别名,我们输入:
Ext.create('Ext.container.Container',{
布局:'vbox'
,项目:[{
xtype:'mygrid'
// 配置
}]
});
Ext.create('Ext.container.Container',{
布局:'vbox'
,项目:[{
xtype:'mygrid'
// 配置
}]
});
后者比前者少了大约 20 次击键。现在假设您需要在更大的应用程序中使用您的 classes 数百次。很明显,xtype 节省了大量的输入,而不是说减少了长名称拼写错误的风险。
其次,同样非常有价值的好处是 Ext.create 无条件实例化 class,无论是否需要。您可以在大型应用程序中拥有许多用户可能永远不会点击或很少点击的视图、选项卡面板或卡片布局。
换句话说,一些定义的class永远不会被实例化,或者它们可以等到用户需要它们时再实例化。因此,xtype 可以节省内存,这在现代计算机中不是很重要,因为实例化 Ext/Touch classes 不吃 GB。
我想提的最后一个好处,也是非常重要的,是大大提高了代码的可读性和可维护性。代码不仅编写一次并在运行时被遗忘,而且它会被许多开发人员阅读、调试和修改,因此使代码更短、更好和更容易理解的一切都很重要
我想知道为什么我们需要在 ExtJS 类 上配置别名?它有什么好处?
xtype
和 alias
用于从其他对象中获取对对象的引用,而不是自己实例化它们或将它们放入变量中。
因为 Ext.form.TextField
有一个 xtype
'textfield' 我们可以这样做:
items: [{
xtype: 'textfield',
autoWidth: true,
fieldLabel: 'something'
}]
像这样定义视图有很大的好处。通过这种方式,框架将 lazy load 对象。
以后也可以用Ext.ComponentQuery.query()
例如:
Ext.create('MyApp.view.MyButton', {
xtype: 'mybutton',
.....
});
稍后在您的代码中,如果您这样做:
var buttonArray = Ext.ComponentQuery.query('mybutton');
更多信息:
https://www.sencha.com/forum/showthread.php?150577-Ext.define-xtype-vs-alias
http://docs.sencha.com/extjs/4.1.3/#!/guide/application_architecture
https://www.sencha.com/forum/showthread.php?29531-Form-inside-Accordion-inside-Window&p=138612&viewfull=1#post138612
第一个最简单但有价值的好处是您不需要输入可能很长的 class 名称,但是当您需要使用 class 时可以使用较短的别名。
假设我们需要在布局中使用上面的class
没有别名,我们需要输入:
Ext.create('Ext.container.Container',{
布局:'vbox'
,项目:[
Ext.create('MyApp.view.MyGridView',{
// 配置
})
]
});
Ext.create('Ext.container.Container',{
布局:'vbox'
,项目:[
Ext.create('MyApp.view.MyGridView',{
// 配置
})
]
});
使用别名,我们输入:
Ext.create('Ext.container.Container',{ 布局:'vbox' ,项目:[{ xtype:'mygrid' // 配置 }] });
Ext.create('Ext.container.Container',{ 布局:'vbox' ,项目:[{ xtype:'mygrid' // 配置 }] }); 后者比前者少了大约 20 次击键。现在假设您需要在更大的应用程序中使用您的 classes 数百次。很明显,xtype 节省了大量的输入,而不是说减少了长名称拼写错误的风险。
其次,同样非常有价值的好处是 Ext.create 无条件实例化 class,无论是否需要。您可以在大型应用程序中拥有许多用户可能永远不会点击或很少点击的视图、选项卡面板或卡片布局。
换句话说,一些定义的class永远不会被实例化,或者它们可以等到用户需要它们时再实例化。因此,xtype 可以节省内存,这在现代计算机中不是很重要,因为实例化 Ext/Touch classes 不吃 GB。
我想提的最后一个好处,也是非常重要的,是大大提高了代码的可读性和可维护性。代码不仅编写一次并在运行时被遗忘,而且它会被许多开发人员阅读、调试和修改,因此使代码更短、更好和更容易理解的一切都很重要