ExtJs 備忘錄(9)—— Ext常用屬性、方法小結 [系列完]

前言

   關鍵字:農民伯伯,Ext. is,copyTo,flatten,unique,pluck,invoke,format,grid,Array,Function,學習,筆記,總結,技巧

   接觸ExtJs的時間並不長,走了很多彎路,由於短時間內不會再使用ExtJs,所有通過這系列文章彙總、梳理和補充關於ExtJs的點滴以備忘之,系列文章大部分是收集和整理,小部分自己的心得和補充,着重實踐,提供完整代碼,: )

 

 

系列

  1.  ExtJs 備忘錄(1)—— Form表單(一) [ 控件使用 ]
  2.  ExtJs 備忘錄(2)—— Form表單(二) [ 控件封裝 ]
  3.  ExtJs 備忘錄(3)—— Form表單(三) [ 數據驗證 ]
  4.  ExtJs 備忘錄(4)—— Form表單(四) [ 數據提交 ]
  5.  ExtJs 備忘錄(5)—— GirdPanl表格(一)[ 基本用法 ]
  6.  ExtJs 備忘錄(6)—— GirdPanl表格(二)[ 搜索分頁 ]
  7.  ExtJs 備忘錄(7)—— GirdPanl表格(三)[ 統計|查看、修改單行記錄 ]
  8.  ExtJs 備忘錄(8)—— 管理界面搭建和其他部分控件介紹
  9.  ExtJs 備忘錄(9)—— Ext常用屬性、方法小結 [系列完]

 

正文 

  一、Ext

    1.1  Ext.isEmpty(v, allowBlank)  //是否爲空[鏈接]

    1.2  Ext.isArray(v)     //是否爲數組集合

    1.3  Ext.isPrimitive(v)    //是否是基本數據類型String/Number/Boolean

    1.4  Ext.isFunction(v)    //是否是函數

    1.5  Ext.isNumber(v)     //是否是數字

    1.6  Ext.isString(v)    //是否是字符串

    1.7  Ext.isBoolean(v)   //是否是bool值

    1.8  Ext.isIE/isIE6/isIE7/isIE8...  //判斷瀏覽器

    1.9  Ext.isWindows/isLinux/isMac/isAir  //判斷平臺(操作系統)

    1.10  Ext.isDefined    //對象是否已經定義

    1.11  Ext.id(el,prefix)  //返回唯一的id值,el位元素Id,prefix爲前綴

    1.12  Ext.urlEncode(o, pre)  //將JSON數據轉換URL參數串,如{a:1,b:2} => a=1&b=2

    1.13  Ext.urlDecode(string, overwrite)  //將url參數列表轉換成json格式數據,overwrite如果爲true,則後面的同名參數值覆蓋前面的同名參數值(默認爲false即不覆蓋而以數組形式返回)

    1.15  Ext.each(array, fn, scope)  //遍歷數組,例:Ext.each([1,2,3],function(value,index,a){ //index:索引號,0開始  value:當前值 a:數組引用 });

    1.16  Ext.encode(o)    //將對象轉換成json字符串,詳細說明和用法:這裏

    1.17  Ext.decode(o)    //將json字符串轉換成對象

    [Ext-more.js] 

    1.18  Ext.combine()  //數組合並

    1.19  Ext.num(value,defaultValue)  //如果是數字,直接返回本身,否則返回默認值,注意"5"這裏也會返回默認值的 

    1.20  Ext.copyTo(dest, source, names)  //拷貝source中names屬性列表至dest中

    1.21  Ext.unique(arr)   //剔除數組中重複的元素,讓數組每個元素保持唯一

    1.22  Ext.clean(arr)     //複製數組?! 

    1.23  Ext.flatten(arr)   //將多維數組轉換成一維數組

    1.24  Ext.min(arr, comp)  //查找數組中最小的元素

    1.25  Ext.max(arr, comp)  //查找數組中最大的元素

    1.26  Ext.mean(arr)     //計算數組元素平均值(總和除以個數)

    1.27  Ext.partition(arr, truth)  //根據arr元素的bool值拆分成新的二維數組並返回 例1:Ext.partition([true, false, true, true, false]); // [[true, true, true], [false, false]] 例2:Ext.partition(arr,function(val){ return val == "class1" });

    1.28  Ext.invoke(arr, methodName,/*args...*/)  //執行arr數組中對象的methodName方法,args爲方法的參數,返回執行結果數組

    1.29  Ext.pluck(arr, prop)  //返回數組中屬性名(property name)等於prop的值的新數組 Ext.pluck(arr, "className"); => [arr1.className,arr2.className]

    1.30  Ext.zip({Arrays|NodeLists},{Function}) //壓縮多個數組爲一個數組, Ext.zip([1,2,3],[4,5,6]); // [[1,4],[2,5],[3,6]],支持Function自定義合併

    1.31  Ext.type(object)  //返回對象的類型:string,number,boolean,function,object,array,regexp,element,nodelist,textnode,whitespace 

 

  二、Ext.util.Format

    2.1  Ext.util.Format.capitalize(value);  //首字母大寫
    2.2  Ext.util.Format.ellipsis(value, len, word);   //從字符串開始處截取len長度顯示,超過部分用...表示;word爲布爾值,爲true時在前面截取的基礎上再從' '、'.'、'!'、'?'關鍵字處截取前面(len),ellipsis("abcde.fghijkl",10,true)返回abcde
    2.3  Ext.util.Format.htmlEncode(value);   //HTML編碼,將& <  >  “替換爲&amp;&lt;&gt;&quot;
    2.4  Ext.util.Format.htmlDecode(value);   //HTML解碼,與上面相反
    2.5  Ext.util.Format.trim(value);       //截取字符串左右的空格
    2.6  Ext.util.Format.substr(value, start, length);   //從value指定的start位置開始截取length長度的子串返回
    2.7  Ext.util.Format.lowercase(value);        //轉換大寫
    2.8  Ext.util.Format.uppercase(value);       //轉換小寫
    2.9  Ext.util.Format.stripTags(v);          //去除HTML標籤:/<\/?[^>]+>/gi
    2.10  Ext.util.Format.usMoney(v);       //轉換到'$'符號的貨幣形式
    2.11  Ext.util.Format.date(v, format);    //格式化日期輸出,format默認格式"m/d/Y"
    2.12  Ext.util.Format.round(value, precision);  //四捨五入,precision指精確位數
    2.13  Ext.util.Format.number(v, format);    //格式化數字顯示
    2.14  Ext.util.Format.nl2br(value);     //將字符串中的'\n'替換成'<br />'
    2.15  Ext.util.Format.fileSize(value);    //將字節數轉成更大的單位KB和MB顯示,fileSize(1024) = 1KB
    2.16  Ext.util.Format.defaultValue(value, defaultValue);  //如果value未定義或爲空字符串則返回defaultValue
    2.17  Ext.util.Format.stripScripts(v);   //去除腳本標籤
    2.18  Ext.util.Format.undef(value);    //如果value未定義,返回空字符串,反之返回value本身 


  三、擴展JS原有對象

    3.1  String

      3.1.1  .format(format)  //和C#裏面是一樣的用法

      3.1.2  .toggle(value, other)  //交換值,如果當前值等於value,則被賦值other

    3.2  Array

      3.2.1  .indexOf(o)  //返回元素o在數組ArrayObject中的位置,找不到返回-1

      3.2.2  .remove(o)  //從數組ArrayObject刪除元素o

    3.3  Function

      3.3.1  .createInterceptor(fcn, scope)  //創建阻斷方法,如果fcn返回false,原方法將不會被執行,參見這裏

      3.3.2  .createCallback(/*args...*/)   //創建回調,以無參的函數作爲參數,但是現有的方法已經具有了參數,如果直接寫上可以用這個來創建一個回調,類似於function(){ //實際的帶參調用 } ,見這裏1這裏2

      3.3.3  .createDelegate(obj, args, appendArgs) //創建委託,與上面相比,自己可以訪問obj中的屬性和方法,見這裏

      3.3.4  .defer(millis, obj, args, appendArgs)  //定時執行,隔millis毫秒後執行原方法,參見這裏

      3.3.5  .createSequence(fcn, scope)    //Ext-more.js中,創建組合方法,執行原方法+fcn,參見這裏

 

  四、 其他

    4.1  表單

      4.1.1  一次取得表單所有的表單元素key/value集合

        form1.form.getValues()  //form1爲Ext.FormPanel,例如:

複製代碼
                        //注意
                        var conn = new Ext.data.Connection();
                        conn.request({
                            url: 
'submit.aspx?method=Submit4',
                            
//此處與params對應,如果爲POST,則服務器端從Request.Form中可以取得到數據,反之從QueryString中取數據
                            method: 'POST',//GET
                            params:form1.form.getValues(),
                            success: 
function(response, opts) {
                                 MsgInfo(response.responseText);
                            }
                        });
複製代碼

        form1.form.setValues(values)     //form1.form.setValues({id:1,name:'aabbcc'}) 賦值

      4.1.2  表單元素取值賦值一次取得

        4.1.2.1  form1.form.findField('TextBox').getValue()

        4.1.2.2  form1.form.getValues().TextBox

        4.1.2.3  form1.form.getFieldValues().TextBox

    4.2  切換皮膚

      Ext.util.CSS.swapStyleSheet("theme", "resources/css/ext/xtheme-orange.css");    //注意路徑

 

 

注意

  1.  本系列Ext版本爲 3.0.0

  2.  最新源代碼在系列文章第八篇有下載。

  3.  關於ExtJs的優點請移步至系列文章第一篇評論中我的回答,這裏就不要再討論了 :)

 

 

文章參考和推薦

  1.  一切皆有可能關於ext的基礎系列

  2.  Google:Ext API 詳解

  3.  Ext研究(1)——關於Function類的一些新方法的使用

  4.  Ext.template分析

  5.  《仔仔細細分析Ext》 Ext對Function類的擴展

 

 

結束語 

  建議多看看源碼和源碼分析的文章,歡迎交流、補充 :)

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章