Ext.js 问答
什么是 Ext JS?
Ext JS 代表扩展的 JavaScript。它是一个 JavaScript 框架,用于开发基于 Web 的丰富 UI 桌面应用程序。
Ext JS 扩展在哪个库上?
它是从 YUI(雅虎用户界面)扩展而来的 Sencha 产品。
HTML 页面添加的主要库文件有哪些?
这些是包含在 HTML 页面中以运行 Ext JS 代码的主要文件-
Ext-all.js
Ext-all.css
解释 Ext JS 的特性。
可自定义的 UI 小部件,其中包含丰富的 UI,例如网格、透视网格、表单、图表、树。
新版本与旧版本的代码兼容性。
灵活的布局管理器有助于跨多个浏览器、设备和屏幕尺寸组织数据和内容的显示。
高级数据包将 UI 小部件与数据层分离。该数据包允许使用支持排序和过滤等功能的功能强大的模型在客户端收集数据。
它与协议无关,可以从任何后端源访问数据。
可定制的主题 Ext JS 小部件可用于跨平台一致的多个开箱即用主题。
解释使用 Ext JS 的优势。
简化跨台式机、平板电脑和智能手机的跨平台开发-适用于现代和旧版浏览器。
通过 IDE 插件集成到企业开发环境中,从而提高开发团队的工作效率。
降低网络应用开发成本。
使团队能够创建具有引人入胜的用户体验的应用。
它有一组小部件,可让用户界面变得强大而简单。
它遵循 MVC 架构,因此代码具有高度可读性。
解释使用 Ext JS 的限制。
库的大小很大,大约 500 KB,这使得初始加载时间更长,并使应用程序变慢。
HTML 充满了 <DIV> 标签,这使得调试变得复杂和困难。
根据一般公共许可政策,开源应用程序是免费的,但商业应用程序需要付费。
有时,即使加载简单的东西也需要几行代码,这在纯 html 或 Jquery 中更简单。
需要非常有经验的开发人员来开发 Ext JS 应用程序。
Ext JS 支持哪些浏览器?
Ext JS 支持跨浏览器兼容性,它支持所有主流浏览器-
IE 6 及更高版本
Firefox 3.6 及更高版本
Chrome10 及更高版本
Safari 4 及更高版本
Opera 11 及更高版本
Ext JS 支持哪种架构?
Ext JS 4+ 支持 MVC(模型视图控制器)架构。从 Ext JS 5 开始,它也开始支持 MVVM(模型视图视图模型)。
Ext JS 的最新版本是什么及其好处?
Ext JS 6 是 Ext JS 的最新版本,它的主要优点是它可以用于桌面和移动应用程序。基本上它是 Ext JS(桌面应用程序)和 Sencha touch(移动应用程序)的合并。
给第一次使用它的开发者的建议。
Ext JS 是一个 JavaScript 框架,因此要开始使用它,您应该具备 HTML 和 JS 的先验知识(不是专家级别,但应该有基本的了解)。然后需要了解基础知识,所以给它时间慢慢学习。
Ext JS 和 jQuery 的区别。
这两个框架完全不同,我们可以比较 Ext JS 和 jQuery UI,因为 Ext JS 是成熟的 UI 丰富的框架。但是 Ext JS 的组件仍然比 jQuery UI 多得多。
Ext JS 和 Angular JS 的区别。
参数 |
Ext JS |
Angular JS |
丰富的用户界面 |
Ext JS 提供了丰富的 UI 选项,例如表单、网格、图表 |
Angular JS 没有提供丰富的内置 UI |
丰富的主题UI组件 |
Ext JS 提供多种内置主题 |
Angular JS 不提供 Rich UI,它必须与 AngularUI、AngularBootstarp 等集成。 |
跨浏览器兼容性 |
Ext JS 提供跨浏览器兼容性,几乎适用于所有浏览器 IE6+、FF、Chrome、Safari、Opera 等 |
Angular JS 不得不使用第三方库如 jQuery、jqLite 来解决这个问题。 |
自动测试支持 |
只能使用外部工具 |
提供内置。 |
双向数据绑定 |
在 Ext JS 5 中包含了两种方式的绑定。 |
它支持从第一个版本开始的双向绑定。 |
性能 |
Ext JS 相对较重且较慢。 |
Angular JS 是比 Ext JS 轻量级的框架 |
构建工具 |
Ext JS 使用 Sencha cmd 工具进行构建 |
Angular JS 使用第三方工具,例如 grunt。 |
你对不同版本的 Ext JS 了解多少?
Ext JS 1.1
Ext JS 的第一个版本是由 Jack Slocum 在 2006 年开发的。它是一组实用程序类,是 YUI 的扩展。他将图书馆命名为 YUI-ext。
Ext JS 2.0
Ext JS 2.0 版于 2007 年发布。此版本具有用于桌面应用程序的新 API 文档,但功能有限。此版本不向后兼容以前版本的 Ext JS。
Ext JS 3.0
Ext JS 3.0 版于 2009 年发布。此版本添加了图表和列表视图等新功能,但以速度为代价。它向后兼容 2.0 版。
Ext JS 4.0
Ext JS 3 发布后,Ext JS 的开发人员面临着提高速度的主要挑战。 Ext JS 4.0版本于2011年发布,完整改版后的架构,遵循MVC架构,应用速度快。
Ext JS 5.0
Ext JS 5.0 版本于 2014 年发布。此版本的主要变化是将 MVC 架构更改为 MVVM 架构。它包括在支持触控的设备上构建桌面应用的能力、双向数据绑定、响应式布局以及更多功能。
Ext JS 6.0
Ext JS 6 合并了 Ext JS(用于桌面应用程序)和 sencha touch(用于移动应用程序)框架。
有哪些不同的 Ext JS 组件?
Ext JS 有各种 UI 组件,其中一些主要使用的组件是-
网格
表格
消息框
进度条
工具提示
窗口
HTML 编辑器
图表
Ext JS 中的 xType 是什么?
xType 定义了 Ext JS UI 组件的类型,在组件渲染时确定。例如。文本字段、数字、按钮等
Ext JS 中的 vType 是什么?
这是可以轻松自定义的验证类型。 Ext JS 提供的 vType 很少-
alphanumText-如果输入的文本具有除 alphabate 或数值以外的任何符号,则返回 false。
emailText-如果文本不是有效的电子邮件地址,则返回 false。
Ext JS 是否可以与 Ajax 集成,如果是,然后解释一个 sim请使用它?
是的 Ext JS 可以与 Ajax 集成。实现为:假设在模糊后的某个文本框上,它必须验证来自服务器的数据,因为我们可以对文本框 id 进行 Ajax 调用 onblur/onchange 以检查在文本框中输入的数据是否存在于服务器/数据库中.
Ext JS 可以与其他服务器端框架集成吗?
是的 Ext JS 可以与其他服务器端框架集成,例如 Java、.net、Ruby on rails、PHP、ColdFusion 等。
解释 Ext JS 实现工具。
Ext JS 可以在任何流行的集成开发环境 (IDE) 上实现,例如 Eclipse、Aptana、Sublime、Webstrom 等。
Ext JS中访问DOM元素的方式有哪些?
这些是在 Ext JS 中访问 DOM 元素的几种方法-
Ext.get()
Ext.getElementById()
Ext.fly()
Ext.select()
MVVM 架构中的 Viewmodel 是什么?
MVVM 架构是模型视图视图模型。在 MVVM 架构中,MVC 的控制器被 ViewModel 取代。
ViewModel-它基本上表明视图和模型之间的变化。它将数据从模型绑定到视图。同时它与视图没有任何直接交互,它只有模型知识。
为按钮点击编写一个监听器。
Ext.getCmp('buttonId').on('click', function(){
// statement to perform logic
});
解释Ext.onReady()的使用。
Ext.onReady() 是第一个在 DOM 完全加载时调用的方法,以便在脚本运行时您想要引用的任何元素都可用。
为在页面上点击的任何 div 元素编写一个监听器。
Ext.select('div').on('click', function(){
// statement to perform logic
});
Ext JS 中有哪些不同类型的警告框?
Ext JS 中不同类型的警告框是-
Ext.MessageBox.alert();
Ext.MessageBox.confirm();
Ext.MessageBox.wait();
Ext.MessageBox.promt();
Ext.MessageBox.show();
商店、模型和控制器的基类是什么?
Store 的基类是 Ext.data.Store
对于模型是 Ext.data.Model
对于控制器是 Ext.app.controller
Ext JS 中有哪些不同的事件处理方式?
这些是事件处理的不同方式-
使用监听器
稍后附加事件
使用自定义事件
如何获取商店中没有记录?
Store.getCount()-对于缓存记录
Store.getTotalCount()-数据库中的记录总数。
如何获取store中修改过的记录?
Store.getModifiedRecords()方法用于获取修改后的记录。
如何更新商店中的记录?
Store.commitChanges() 方法来更新存储更改。
如何使用索引获取Store记录?
如果我们有网格 ID : Ext.getCmp('gridId').getStore().getAt(index);
如果我们有商店 ID:Ext.getStore('storeId').getAt(index);
加载存储数据的函数是什么?
编写表单、网格、图表、面板和树的基类。
Grid 的基类-Ext.grid.GridPanel
对于表单 – Ext.form.Panel
对于面板 – Ext.panel.Panel
对于图表 – Ext.chart.Chart
对于树-Ext.tree.Panel
Ext JS 中有哪些不同类型的布局?
不同类型的布局是-
Absolute
Accordion
Anchor
Border
Auto
hBox
vBox
Card(TabPanel)
Card(Wizard)
Column
Fit
Table
如何对网格应用分页?
这可以使用 pagingToolbar() 作为-
new Ext.PagingToolbar ({
pageSize: 25,
store: store,
displayInfo: true,
displayMsg: 'Displaying topics {0}-{1} of {2}',
emptyMsg: 'No topics to display',
});
// trigger the data store load
store.load({params:{start:0, limit:25}});
如何添加停靠项?
dockedItems: [{
xtype: 'toolbar',
items: [{
id:'buttonId',
handler: function() {
Ext.Msg.alert('title','alertMsg');
});
}]
}]
什么是负载掩码及其用途?
Loadmask 用于通过向用户显示加载(或自定义消息)直到数据呈现到网格来阻止任何其他操作。负载掩码:真;是在数据呈现到网格时显示加载掩码的属性。
什么是渲染器及其用途?
当我们想要操作我们从商店获得的数据以根据某些标准显示操作数据时使用渲染器。它是一个列属性,可以用作-
renderer: function(value, metadata, record, rowIndex, colIndex, store){
// logic to perform
}
如何在 Ext JS 中获取元素的值?
Ext.getCmp('id').getValue();
如何隐藏网格中的列?
网格中排序的属性是什么?
store中load事件之前和之后怎么写?
grid.getStore().on ({
beforeload : function(store) {
// perform some operation
},
load : {
fn : function(store) {
//perform some operation
},
scope : this
}
store.load();
});
如何将 Ext JS 6 用于桌面和移动应用程序?
Ext JS 6 有工具包包,它可以包含两个框架(Ext JS 和 Sencha Touch)的视觉元素。
它可以添加为-
'工具包':'经典',//或'现代'
如果工具包是经典的,它包括 Ext JS 桌面应用程序框架。
如果工具包是现代的,那么它包括 sencha touch 移动应用程序框架。
下一步是什么?
此外,您可以回顾过去完成的有关该主题的作业,并确保您能够自信地谈论这些作业。如果你是新人,面试官不会期望你回答非常复杂的问题,而是你必须让你的基础概念非常强大。
第二,如果你不能回答几个问题真的没有多大关系,但重要的是无论你回答什么,你必须自信地回答。所以在你的面试中充满自信。我们在 lidihuo 祝你好运有一个好的面试官,并为你未来的努力一切顺利。干杯:-)