Ext.js 面向对象特性

最近这单业务比较特殊，客户要求必须使用ext.js进行前端开发,虽然技术比较老，但是还是有很多人在用。

大家都知道该框架是完全面向对象的，当学习一门新技术时肯定要先了解基础的编码风格和基础语法，现将ext.js的面向对象特性整理如下

<script type="text/javascript">        //声明命名空间        Ext.namespace("Qx.Ext");        //定义类(默认构造函数)        Qx.Ext.Panda = function () {            //定义类事件            this.addEvents("BeforeSay",                "AfterEat");        }; // Ext.emptyFn;        //定义类(带参数构造函数)        //Qx.Ext.Panda = function(obj) {        //    Ext.apply(this, obj);        //};        //定义类成员        //Ext.apply        Ext.extend            (            //Qx.Ext.Panda.prototype            Qx.Ext.Panda,            Ext.util.Observable//继承事件工具类            , {            //成员变量            nickName: "四川大熊猫",            sex: "男",            //成员方法            Say: function () {                //触发前置事件                this.fireEvent("BeforeSay", this, this.nickName);                log("我的名字是" + this.nickName + "[" + this.sex + "]");            },            //成员方法(带参数)            Eat: function(food) {                log(String.format("{0}正在吃{1}",this.nickName, food));                //触发后置事件                this.fireEvent("AfterEat", this, this.nickName, food);            }        });        //定义类静态方法（带参数）        Qx.Ext.Panda.GetType = function(note) {            log(note + "Qx.Ext.Panda");        }</script><script type="text/javascript">        Ext.namespace("Qx.Ext.Zoo");        //设置命名空间别名（全局有效）        var _Zoo = Qx.Ext.Zoo;        //用别名定义类        _Zoo.BigPanda = function () { };        //设置类别名（全局有效）        var BIG_PANDA = _Zoo.BigPanda;        //类继承        Ext.extend(BIG_PANDA,           Qx.Ext.Panda, {            Run:function() {                log(this.nickName+"正在飞快的奔跑");            },               //重写父类方法            Eat: function (food) {                log(String.format("大熊猫正在吃{0}",  food));            }        });</script><script type="text/javascript">                //实例化类Panda                var panda = new Qx.Ext.Panda();                //var panda = new Qx.Ext.Panda({ nickName: '熊姐姐', sex: '女' });                //调用成员变量                log(panda.nickName, "panda.nickName");                //设置事件处理                panda.on("AfterEat",function(obj,name,food) {                    log(String.format("广播：{0}吃了10kg{1}", name, food));                });                panda.on("BeforeSay", function (obj, name) {                    log(String.format("广播：{0}喝了一大瓶水，然后准备说话", name));                    });                //调用成员函数                panda.Say();                panda.Eat("竹子");                //调用类静态方法（带参数）                Qx.Ext.Panda.GetType("[Type]");                //调用子类                var bigPanda = new Qx.Ext.Zoo.BigPanda();                bigPanda.Run();                //调用子类被重写的方法                bigPanda.Eat("大竹子");</script>

运行效果如下