`
83026191
  • 浏览: 45767 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

ExtJS精华函数解析(仅个人见解)

阅读更多

One:    Ext的最先开始的精华函数要算Ext.namespace,它采取的是命名空间的方式.从而可以避免各种变量啊.对象的冲突问题

Two:    Ext的apply采取的是对象继承方式,Ext.apply(o,c,object),既o继承c的所有属性.并且o也拥有object的一切属性

Three   Ext的applyIf采取的对象继承方式,这个跟上面的继承有一点不同,Ext.applyIf(o,c)就是只有当o里的对象不存在时才继承.反之就不继承.

Four:   Ext的extend,这个也是整个Ext的精华所在,所有的对象继承,扩展都是根据Ext.extend的方法而来.本人写的一个htmlEditor也才是看懂了extend方法才搞清楚如何写扩展.
        htmlEditor表情扩展查看地址:http://extjs.com/forum/showthread.php?t=13213    http://extjs.com/learn/Image:Face.jpg.jpg
        Ext.extend(sb, sp, overrides)即sb扩展sp的所有对象,overriders即你想增加的对象或者方法.可以覆盖sp的对象也与方法及属性.



这是本人从ext中扣出来的精华部分,大家完全可以根据这个精华自己去写扩展,写框架.

 

  1. if(typeof(Ext)=="undefined"){
  2.         var Ext={};
  3. }
  4. window["undefined"] = window["undefined"];
  5. Ext.apply = function(o, c, defaults){
  6.     if(defaults){
  7.         Ext.apply(o, defaults);
  8.     }
  9.     if(o && c && typeof c == 'object'){
  10.         for(var p in c){
  11.             o[p] = c[p];
  12.         }
  13.     }
  14.     return o;
  15. };
  16. (function(){
  17.         var ua = navigator.userAgent.toLowerCase();
  18.     var isStrict = document.compatMode == "CSS1Compat",
  19.                 isSafari = (/webkit|khtml/).test(ua),
  20.                 isIE = ua.indexOf("msie") > -1,
  21.         isIE7 = ua.indexOf("msie 7") > -1,
  22.         isGecko = !isSafari && ua.indexOf("gecko") > -1;
  23.         if(isIE && !isIE7){
  24.         try{
  25.             document.execCommand("BackgroundImageCache", false, true);
  26.         }catch(e){}
  27.     }
  28.         Ext.apply(Ext,{
  29.                 emptyFn : function(){},
  30.                 applyIf : function(o, c){
  31.             if(o && c){
  32.                 for(var p in c){
  33.                     if(typeof o[p] == "undefined"){ o[p] = c[p]; }
  34.                 }
  35.             }
  36.             return o;
  37.         },
  38.                 extend : function(){
  39.             var io = function(o){
  40.                 for(var m in o){
  41.                     this[m] = o[m];
  42.                 }
  43.             };
  44.             return function(sb, sp, overrides){
  45.                 if(typeof sp == 'object'){
  46.                     overrides = sp;
  47.                     sp = sb;
  48.                     sb = function(){sp.apply(this, arguments);};
  49.                 }
  50.                 var F = function(){}, sbp, spp = sp.prototype;
  51.                 F.prototype = spp;
  52.                 sbp = sb.prototype = new F();
  53.                 sbp.constructor=sb;
  54.                 sb.superclass=spp;
  55.                 if(spp.constructor == Object.prototype.constructor){
  56.                     spp.constructor=sp;
  57.                 }
  58.                 sb.override = function(o){
  59.                     Ext.override(sb, o);
  60.                 };
  61.                 sbp.override = io;
  62.                 Ext.override(sb, overrides);
  63.                 return sb;
  64.             };
  65.         }(),
  66.                 override : function(origclass, overrides){
  67.             if(overrides){
  68.                 var p = origclass.prototype;
  69.                 for(var method in overrides){
  70.                     p[method] = overrides[method];
  71.                 }
  72.             }
  73.         },
  74.                 namespace : function(){
  75.             var a=arguments, o=null, i, j, d, rt;
  76.             for (i=0; i<a.length; ++i) {
  77.                 d=a[i].split(".");
  78.                 rt = d[0];
  79.                 eval('if (typeof ' + rt + ' == "undefined"){' + rt + ' = {};} o = ' + rt + ';');
  80.                 for (j=1; j<d.length; ++j) {
  81.                     o[d[j]]=o[d[j]] || {};
  82.                     o=o[d[j]];
  83.                 }
  84.             }
  85.         },
  86.                 urlEncode : function(o){
  87.             if(!o){
  88.                 return "";
  89.             }
  90.             var buf = [];
  91.             for(var key in o){
  92.                 var ov = o[key], k = encodeURIComponent(key);
  93.                 var type = typeof ov;
  94.                 if(type == 'undefined'){
  95.                     buf.push(k, "=&");
  96.                 }else if(type != "function" && type != "object"){
  97.                     buf.push(k, "=", encodeURIComponent(ov), "&");
  98.                 }else if(ov instanceof Array){
  99.                     if (ov.length) {
  100.                             for(var i = 0, len = ov.length; i < len; i++) {
  101.                                 buf.push(k, "=", encodeURIComponent(ov[i] === undefined ? '' : ov[i]), "&");
  102.                             }
  103.                         } else {
  104.                             buf.push(k, "=&");
  105.                         }
  106.                 }
  107.             }
  108.             buf.pop();
  109.             return buf.join("");
  110.         },
  111.                 urlDecode : function(string, overwrite){
  112.             if(!string || !string.length){
  113.                 return {};
  114.             }
  115.             var obj = {};
  116.             var pairs = string.split('&');
  117.             var pair, name, value;
  118.             for(var i = 0, len = pairs.length; i < len; i++){
  119.                 pair = pairs[i].split('=');
  120.                 name = decodeURIComponent(pair[0]);
  121.                 value = decodeURIComponent(pair[1]);
  122.                 if(overwrite !== true){
  123.                     if(typeof obj[name] == "undefined"){
  124.                         obj[name] = value;
  125.                     }else if(typeof obj[name] == "string"){
  126.                         obj[name] = [obj[name]];
  127.                         obj[name].push(value);
  128.                     }else{
  129.                         obj[name].push(value);
  130.                     }
  131.                 }else{
  132.                     obj[name] = value;
  133.                 }
  134.             }
  135.             return obj;
  136.         },
  137.                 isIE : isIE,
  138.         isIE7 : isIE7,
  139.         isGecko : isGecko,
  140.                 isStrict:isStrict
  141.         });
  142. })();

  143. Ext.applyIf(String, {
  144.     escape : function(string) {
  145.         return string.replace(/('|\\)/g, "\\$1");
  146.     },

  147.     /**
  148.                 var s = String.leftPad('123', 5, '0');
  149.                 // s now contains the string: '00123'

  150.      */
  151.     leftPad : function (val, size, ch) {
  152.         var result = new String(val);
  153.         if(ch === null || ch === undefined || ch === '') {
  154.             ch = " ";
  155.         }
  156.         while (result.length < size) {
  157.             result = ch + result;
  158.         }
  159.         return result;
  160.     },

  161.     /**
  162.                 var cls = 'my-class', text = 'Some text';
  163.                 var s = String.format('<div class="{0}">{1}</div>', cls, text);
  164.                 // s now contains the string: '<div class="my-class">Some text</div>'

  165.      */
  166.     format : function(format){
  167.         var args = Array.prototype.slice.call(arguments, 1);
  168.         return format.replace(/\{(\d+)\}/g, function(m, i){
  169.             return args[i];
  170.         });
  171.     }
  172. });

  173. Ext.applyIf(Array.prototype, {
  174.     indexOf : function(o){
  175.        for (var i = 0, len = this.length; i < len; i++){
  176.               if(this[i] == o) return i;
  177.        }
  178.            return -1;
  179.     },
  180.     remove : function(o){
  181.        var index = this.indexOf(o);
  182.        if(index != -1){
  183.            this.splice(index, 1);
  184.        }
  185.     }
  186. });
分享到:
评论

相关推荐

    extjs 常用函数.rar

    在"extjs 常用函数.rar"这个压缩包中,我们重点关注两个特定的函数:`getCMP()` 和 `getDom()`。这两个函数在ExtJS开发中非常常用,帮助开发者获取组件或DOM元素,以便进行后续的操作和交互。 1. `getCMP()` `...

    ASP.NET Extjs精华版图书管理系统源码.rar

    在这个"ASP.NET Extjs精华版图书管理系统源码"中,我们可以推测这是一个结合了ASP.NET后端技术和ExtJS前端技术的图书管理系统。这样的系统通常包括书籍管理、用户管理、借阅与归还、权限控制等功能模块。开发者可能...

    Extjs常用函数和事件.pdf

    在"Extjs常用函数和事件.pdf"中,提到了一些核心类和函数,这些是开发ExtJS应用时经常使用的工具。以下是对这些函数和事件的详细说明: 1. `Ext.onReady(Function fn, Object scope, boolean override)`:这是ExtJS...

    extjs读取解析后端json格式数据显示条形图

    在本案例中,我们将深入探讨如何使用ExtJS读取并解析后端返回的JSON格式数据,然后将这些数据呈现为动态的条形图,以实现吸引用户注意力的视觉效果。 首先,JSON(JavaScript Object Notation)是一种轻量级的数据...

    ExtJs-API中的一些重要的详解文档

    除此之外,ExtJS API还包含许多其他有用的工具函数,如`Ext.encode()`和`Ext.decode()`用于JSON编码和解码,`Ext.mixin()`用于混合类的功能,以及`Ext.create()`用于动态创建组件。这些函数和方法共同构成了ExtJS...

    EXTJS讲解个人项目经历

    EXTJS应用通常从`Ext.onReady`函数开始执行,这是因为在DOM加载完成后,EXTJS会调用这个函数。你可以在此函数中定义初始化的代码,例如显示警告消息或者创建UI组件。 3. **创建组件**: 创建EXTJS组件,例如一个...

    extJs3升级extjs4方案

    ExtJS3 升级到 ExtJS4 方案 ...可以看到,ExtJS4 使用 Ext.create 函数来创建组件类,这样可以更加方便地创建组件。 ExtJS3 升级到 ExtJS4 需要修改大量代码,需要我们重新学习和适应 ExtJS4 的新特性和变化。

    EXTJS单元格变色、行变色

    在EXTJS中,单元格变色可以通过renderer函数来实现。renderer函数是Grid Panel中 columns配置项的一个属性,用于格式化单元格的内容。在上面的代码中,我们可以看到,renderer函数fnColumnColor被应用于“人员名称”...

    EXTJS实用开发指南_个人整理笔记.pdf

    1. Ext.onReady函数:在EXTJS库文件及页面内容加载完后,EXTJS会执行Ext.onReady中指定的函数。 2. 控件的使用:使用EXTJS提供的控件,如面板、选项板、表格、树、窗口、菜单、工具栏、按钮等等。 三、EXTJS控件 ...

    Extjs项目之个人理财项目源码

    Extjs项目之个人理财项目源码 Extjs项目实例

    ExtJs表格grid中文排序函数方法

    ExtJs中文排序函数方法详解 在ExtJs框架中,实现中文排序功能是一件非常重要的事情。今天,我们将详细介绍如何使用ExtJs实现中文排序,特别是使用Ext.data.Store.prototype.createComparator()函数来实现中文排序。...

    Extjs4使用要点个人整理

    JSONStore是ExtJS用于处理JSON格式数据的存储类,它可以与Ajax请求配合使用,自动加载和解析数据。 7. **Ajax提交超时**:`Extjs ajax提交超时.txt`可能涉及Ajax请求的超时设置和处理。在ExtJS中,可以设置请求的...

    Extjs4的FormPanel从后台load json数据的要点

    在本篇文章中,我们将深入探讨如何使用Extjs4中的FormPanel组件从后台加载JSON数据,并将其映射到表单的各个字段中进行显示。这是一项非常实用的技术,尤其是在需要动态填充表单的情况下。 ### 一、Extjs4 ...

    轻松搞定Extjs 带目录

    Extjs的`Ext.util.Format`类提供了一组内置的格式化函数,用于文本、日期和数字的格式化。还可以自定义格式化函数,或者通过`XTemplate`进一步自定义内容。 #### 8. 组件结构 Extjs的组件结构复杂且功能强大,包括...

    Extjs精华版图书管理系统源码_商业源码_sqlserver_ExtJS6._extjs_V2_

    Extjs精华版图书管理系统功能比较强大。该源码 图书管理系统功能实现不是重点,重点是演示对Extjs二次封装使用,进行深入学习。 比较适合对Extjs的学习和进阶以及商业应用,有需要的朋友们不要错过啊。模式:WebForm...

    Extjs4 treePanel节点刷新JS函数

    完美的Extjs4 treePanel节点刷新,函数为自动刷新选中的节点.API看得头疼才别出来的代码.截止我发之前,好像没有谁共享这个功能的函数吧.

    extjs流程界面设计器参考_ExtJS工作流设计器_extjs工作流_extjs_

    ExtJS是一种广泛使用的JavaScript库,专门用于构建富客户端的Web应用程序。它提供了丰富的组件和工具,使得开发者可以创建出功能强大、用户界面友好的Web应用。在“extjs流程界面设计器参考”中,我们主要关注的是...

    ExtJS快速入门 ExtJS快速入门 ExtJS快速入门

    ExtJS快速入门 ExtJS快速入门 ExtJS快速入门 ExtJS快速入门 ExtJS快速入门 ExtJS快速入门 ExtJS快速入门 ExtJS快速入门 ExtJS快速入门 ExtJS快速入门 ExtJS快速入门 ExtJS快速入门ExtJS快速入门 ExtJS快速入门 ExtJS...

    ExtJs-3.2.0.rar

    ExtJS是一个基于JavaScript的开源富客户端框架,专为构建企业级Web应用程序而设计。这个"ExtJs-3.2.0.rar"压缩包包含了ExtJS 3.2.0版本的所有资源,允许开发者利用其强大的组件库和丰富的功能来创建交互式、数据驱动...

Global site tag (gtag.js) - Google Analytics