extjs3.4如何创建对象

在EXTJS 3.4版本中，创建对象是框架中非常基础且重要的操作，它涉及到类的实例化、配置项的使用以及对象间的交互。EXTJS是一个基于JavaScript的富客户端应用开发框架，提供了丰富的组件库和强大的数据管理能力。下面我们将深入探讨如何在EXTJS 3.4中创建对象。 EXTJS使用的是MVC（Model-View-Controller）设计模式，因此在创建对象时，通常会涉及到Model、View和Controller。在EXTJS中，对象通常是由类（Class）创建的实例，这些类定义了对象的行为和属性。 1. 创建基本对象： EXTJS中的所有对象都是由`Ext.extend()`函数或`Ext.apply()`函数来创建的。例如，如果你要创建一个简单的Panel对象，可以这样做： ```javascript var myPanel = Ext.extend(Ext.Panel, { title: '我的面板', width: 300, height: 200, html: '这是面板的内容' }); myPanel = new myPanel(); ``` 这里，`Ext.extend()`用于扩展`Ext.Panel`类，并添加自定义配置。然后通过`new`关键字创建实例。 2. 配置项（Configurations）： EXTJS允许通过配置项来定制对象。在上面的例子中，`title`、`width`和`height`就是配置项。配置项可以通过`config`对象传递，例如： ```javascript var myPanel = new Ext.Panel({ title: '我的面板', width: 300, height: 200, html: '这是面板的内容' }); ``` 3. 自动渲染（Auto Rendering）： 如果希望对象在创建后立即渲染到页面上，可以在配置项中设置`renderTo`属性，指定元素ID： ```javascript var myPanel = new Ext.Panel({ title: '我的面板', width: 300, height: 200, html: '这是面板的内容', renderTo: Ext.getBody() // 渲染到Body元素中 }); ``` 4. 组件组合（Component Hierarchy）： EXTJS允许将多个组件组合在一起，形成复杂的用户界面。例如，可以将一个GridPanel嵌入到Panel中： ```javascript var store = new Ext.data.Store({ // Store配置 }); var grid = new Ext.grid.GridPanel({ store: store, columns: [ // Column配置 // ... ] }); var myPanel = new Ext.Panel({ title: '我的面板', width: 300, height: 200, items: grid, // 将GridPanel作为子组件 renderTo: Ext.getBody() }); ``` 5. 动态加载（Lazy Initialization）： 对于一些不立即使用的对象，EXTJS支持懒初始化。例如，可以将Panel定义为类，然后在需要时实例化： ```javascript MyPanel = Ext.extend(Ext.Panel, { // 类的定义 }); // 当需要时实例化 var myPanel = new MyPanel({ // 配置项 }); ``` 6. 源码和工具： EXTJS的源码是用JavaScript编写的，通过查看源码可以了解其内部工作原理。对于开发和调试，EXTJS提供了开发者工具，如Firebug或Chrome的开发者工具，可以用来检查DOM结构、CSS样式、网络请求等，帮助理解对象的创建和渲染过程。 7. MVC架构： 在EXTJS的MVC架构中，Controller负责处理用户事件，Model管理数据，View展示数据。创建Controller时，可以使用`Ext.app.Controller`类，定义控制方法和引用视图组件： ```javascript Ext.application({ name: 'MyApp', controllers: ['MyController'] }); Ext.define('MyController', { extend: 'Ext.app.Controller', init: function() { this.control({ // 控制器监听的事件和处理方法 }); } }); ``` 总结，EXTJS 3.4创建对象涉及到的基本知识点包括对象实例化、配置项、自动渲染、组件组合、懒初始化以及MVC架构的运用。通过理解和掌握这些概念，可以高效地构建EXTJS应用程序。