10、ExtJs——类的声明、对象创建及关键字

来源：互联网发布：flash player mac 编辑：程序博客网时间：2024/05/21 09:23

在ExtJs中，关于类的声明和对象的创建

//js中类的声明其实就是一个function//第一种：/**function user(){//相当于java的publicthis.name = 'sd';this.age = 26;//var 就相当于高级语言当中的privatevar email = 'yyy@mail.com';this.getEmail = function(){return email;}}var u = new user();alert(u.getEmail());//第二种var Person = {name:'dfsd',age:24};alert(Person.name + "  " + Person.age);*///Ext中类的声明Ext.onReady(function(){/**//第一种：使用newvar win = new Ext.window.Window({title:'dsfsafsd',width:400,height:300});//win.show();//1、得到那个那妞的dom对象//2、为按钮对象添加单击的事件//3、单击的时候调用对象win的show方法Ext.get('d1').on('click',function(){win.show();});*///第二种，使用Ext.create/**var win = new Ext.create('Ext.window.Window',{title:'dsfsafsd',width:400,height:300});win.show();*///第三种：使用Ext.define，/**Ext.define('MyWin',{extend:'Ext.window.Window',title:'dsfsafsd1111111111',width:400,height:300,setTitle:function(){this.title = 'new title';},initComponent:function(){this.setTitle();this.callParent(arguments);}});*///一般的做法是将define部分单独写入一个js文件,然后再jsp中进行引用//如新建一个ux文件夹，在其中定义n_01_js_mywin.js，引入<script type="text/javascript" charset="utf-8" src="base/ux/n_01_js_mywin.js"></script>//这样，程序会很小很干净//有一个问题，当我们定义的组件很多时，在jsp的头中需要引入很多js//解决问题，消除：<script type="text/javascript" charset="utf-8" src="base/ux/n_01_js_mywin.js"></script>这样的引用//方案，就是使用动态加载，前面讲过Ext.Loader.setConfig({          //设置Ext动态加载enabled:true,paths:{myApp:'base/ux'         //加载的路径}});Ext.get('d1').on('click',function(){var win = Ext.create('base.ux.MyWin',{newarg:800,requires:['base.ux.MyWin']    //requires 动态加载});alert(win.getNewarg());alert(win.getHhq());win.show();});});

关于动态加载这一块，使用ExtJs4.2，我是过将
// Ext.Loader.setConfig({ //设置Ext动态加载
// enabled:true,
// paths:{
// myApp:'base/ux' //加载的路径
// }
// });

这一段设置去掉，也能执行成功，然后呢，将
// requires:['base.ux.MyWin'] //requires 动态加载

去掉，也能执行，这个程序示例，这一句Ext.create('base.ux.MyWin'，只要类的定义及创建时类的名字写全，即包名要写全，就能找到，文件名要与类的名字完全一样，路径要一样，即js文件的存放路径要与类定义的包名一致。

关于混入

//混入：mixins//1、简单地混入，mixins：直接跟混入类的数组/**Ext.define('CanSing', {     sing: function() {         alert("I'm on the highway to hell...")     }});Ext.define('Musician', {     mixins: ['CanSing'],        //跟类的数组     mSing:function(){alert('Musician 的mSing');}});var m = Ext.create('Musician');m.sing();m.mSing();*///2、如果混入多个类，且这些类有相同的方法，或被混入类定义方法与混入类相同，使用对象Ext.define('CanSing', {     sing: function() {         alert("CanSing I'm on the highway to hell...")     }});Ext.define('CanSing1', {     sing: function() {         alert("CanSing1.....")     }});Ext.define('Musician', {     mixins: {                              //相当于类多了几个指向混入类的引用         canSing: 'CanSing',         canSing1:'CanSing1'     },     sing: function() {         // delegate singing operation to mixin         this.mixins.canSing.sing.call(this);     }});var m = Ext.create('Musician');m.sing();m.mixins.canSing1.sing();        //使用不同混入类的方法

base.ux.MyWin这个类：在WebRoot/base/ux下建立MyWin.js

Ext.define('base.ux.MyWin',{extend:'Ext.window.Window',title:'dsfsafsd1111111111',width:400,height:300,hhq:'ppp',                           //这个属性不会自动生成get/setgetHhq:function(){return this.hhq ;},//需要自己写config:{            //config中设置的属性会自动生成get set方法newarg:900},setTitle:function(){this.title = 'new title';},initComponent:function(){this.setTitle();this.callParent(arguments);}});

0 0