`

《仔仔细细分析Ext》 Ext对String类的扩展

EXT正则表达式prototypeJavaScriptOO 
阅读更多

原生 String 类：

         一个 length 属性、一个静态方法 String.fromCharCode() 、 17 个实例方法。（这里的称呼都是方便理解的方式，不是严格意义上 OO 的意思。）

         17 个实例方法简表：

1、  charAt()  

2、  charCodeAt() ：返回字符串中指定位置处的字符编码（ Unicode 码值）。

3、  concat() ：把一个或多个值连接到字符串上

4、  indexOf()

5、  lastIndexOf()  

6、  localeCompare() ：用本地化的顺序比较字符串

7、  match(): 用正则表达式进行模式匹配

8、  replace()  

9、  search() ：检索字符串中与正则表达式匹配的子串

10、 slice(): 返回字符串的一个子串

11、 split()

12、 substr()

13、 substring()  

14、 toLowerCase()

15、 toString()

16、  toUpperCase()

17、 valueOf()

 

Ext 对 String 的扩展

         在 Ext.js 中对 String 类扩展了三个静态方法： escape() 、 leftPad() 、 format() ；

两个实例方法： toggle() 、 trim() 。

对 String 类的扩展程序比较简洁，不对废话，仅仅把 Ext 的源码注释和示例翻译一下：


 

Js代码 复制代码
  1. <SPAN style="FONT-SIZE: medium">/**  
  2.  
  3.  * @String类  
  4.  
  5.  * 这些方法是对JavaScript中String类静态方法的扩展  
  6.  
  7.  */  
  8.   
  9. Ext.applyIf(String, {   
  10.   
  11.     /**  
  12.  
  13.      *将传进来的String中的’和\过滤掉  
  14.  
  15.      * @参数 {String} string 需要进行过滤的字符串  
  16.  
  17.      * @返回值 {String} 过滤好的字符串  
  18.  
  19.      * @静态方法  
  20.  
  21.      */  
  22.   
  23.     escape : function(string) {   
  24.   
  25.         return string.replace(/('|\\)/g, "\\$1");   
  26.   
  27.     },   
  28.   
  29.     
  30.   
  31.     /**  
  32.  
  33.      * 用指定的字符填充一个字符串的左侧。对于格式化数字或者日期字符串，这  
  34.  
  35. *一个非常有用的方法。用法示例：  
  36.  
  37.      * <pre><code>  
  38.  
  39. var s = String.leftPad('123', 5, '0');  
  40.  
  41. // s now contains the string: '00123'  
  42.  
  43. </code></pre>  
  44.  
  45.      * @参数1 {String} string 原来的字符串  
  46.  
  47.      * @参数2 {Number} size 返回字符串的总长度  
  48.  
  49.      * @参数3 {String} char (optional) 填充的字符串 (默认用" "填充)  
  50.  
  51.      * @返回值 {String} 填充好的字符串  
  52.  
  53.      * @静态方法  
  54.  
  55.      */  
  56.   
  57.     leftPad : function (val, size, ch) {   
  58.   
  59.         var result = new String(val);   
  60.   
  61.         if(!ch) {   
  62.   
  63.             ch = " ";   
  64.   
  65.         }   
  66.   
  67.         while (result.length < size) {   
  68.   
  69.             result = ch + result;   
  70.   
  71.         }   
  72.   
  73.         return result.toString();   
  74.   
  75.     },   
  76.   
  77.     
  78.   
  79. /*允许你自定义含有占位符的字符串，并且传递任意数量的参数去替代这些占位符。*每一个占位符必须是唯一的，并且以{0}、{1}…这种格式递增。  
  80.  
  81.          *用法示例：  
  82.  
  83.     * <pre><code>  
  84.  
  85. var cls = 'my-class', text = 'Some text';  
  86.  
  87. var s = String.format('&lt;div class="{0}">{1}&lt;/div>', cls, text);  
  88.  
  89. // s now contains the string: '&lt;div class="my-class">Some text&lt;/div>'  
  90.  
  91. </code></pre>  
  92.  
  93.      * @参数1 {String} string 含有占位符，需要格式化的字符串  
  94.  
  95.      * @参数2 {String} value1 替代占位符 {0}的字符串  
  96.  
  97.      * @参数3 {String} value2  替代占位符{1}的字符串，以此类推  
  98.  
  99.      * @返回值 {String} 格式化好的字符串  
  100.  
  101.      * @静态方法  
  102.  
  103.      */  
  104.   
  105.     format : function(format){   
  106.   
  107.         var args = Array.prototype.slice.call(arguments, 1);   
  108.   
  109.         return format.replace(/\{(\d+)\}/g, function(m, i){   
  110.   
  111.             return args[i];   
  112.   
  113.         });   
  114.   
  115.     }   
  116.   
  117. });   
  118.   
  119. /*工具方法，帮助你轻松地在两个字符串之间轮换取值。  
  120.  
  121. *传入的第一个参数值会与当前字符串进行比较，如果它们相等，则把当前字符串赋值*为传入的第二个参数。否则，保持当前值不变。  
  122.  
  123. *注意，该方法会返回一个新的字符串，而不是去改变当前字符串。  
  124.  
  125.  * <pre><code>  
  126.  
  127. // alternate sort directions  
  128.  
  129. sort = sort.toggle('ASC', 'DESC');  
  130.  
  131.    
  132.  
  133. // instead of conditional logic:  
  134.  
  135. sort = (sort == 'ASC' ? 'DESC' : 'ASC');  
  136.  
  137. </code></pre>  
  138.  
  139.  * @参数1 {String} value 需要与当前值进行比较的字符串  
  140.  
  141.  * @参数2 {String} other 如当前字符串与第一个传入的参数相等，赋值给当前字符串的新值。  
  142.  
  143.  * @返回值 {String} 新的字符串  
  144.  
  145.  */  
  146.   
  147. String.prototype.toggle = function(value, other){   
  148.   
  149.     return this == value ? other : value;   
  150.   
  151. };   
  152.   
  153.     
  154.   
  155. /**  
  156.  
  157.  * 去掉字符串两端的空格,保持中间的空格不变。示例：  
  158.  
  159.  * <pre><code>  
  160.  
  161. var s = '  foo bar  ';  
  162.  
  163. alert('-' + s + '-');         //alerts "- foo bar -"  
  164.  
  165. alert('-' + s.trim() + '-');  //alerts "-foo bar-"  
  166.  
  167. </code></pre>  
  168.  
  169.  * @返回值 {String} 去掉两端空格后的字符串  
  170.  
  171.  */  
  172.   
  173. String.prototype.trim = function(){   
  174.   
  175.     var re = /^\s+|\s+$/g;   
  176.   
  177.     return function(){ return this.replace(re, ""); };   
  178.   
  179. }();</SPAN>  
/**

 * @String类

 * 这些方法是对JavaScript中String类静态方法的扩展

 */

Ext.applyIf(String, {

    /**

     *将传进来的String中的’和\过滤掉

     * @参数 {String} string 需要进行过滤的字符串

     * @返回值 {String} 过滤好的字符串

     * @静态方法

     */

    escape : function(string) {

        return string.replace(/('|\\)/g, "\\$1");

    },

 

    /**

     * 用指定的字符填充一个字符串的左侧。对于格式化数字或者日期字符串，这

*一个非常有用的方法。用法示例：

     * <pre><code>

var s = String.leftPad('123', 5, '0');

// s now contains the string: '00123'

</code></pre>

     * @参数1 {String} string 原来的字符串

     * @参数2 {Number} size 返回字符串的总长度

     * @参数3 {String} char (optional) 填充的字符串 (默认用" "填充)

     * @返回值 {String} 填充好的字符串

     * @静态方法

     */

    leftPad : function (val, size, ch) {

        var result = new String(val);

        if(!ch) {

            ch = " ";

        }

        while (result.length < size) {

            result = ch + result;

        }

        return result.toString();

    },

 

/*允许你自定义含有占位符的字符串，并且传递任意数量的参数去替代这些占位符。*每一个占位符必须是唯一的，并且以{0}、{1}…这种格式递增。

         *用法示例：

    * <pre><code>

var cls = 'my-class', text = 'Some text';

var s = String.format('&lt;div class="{0}">{1}&lt;/div>', cls, text);

// s now contains the string: '&lt;div class="my-class">Some text&lt;/div>'

</code></pre>

     * @参数1 {String} string 含有占位符，需要格式化的字符串

     * @参数2 {String} value1 替代占位符 {0}的字符串

     * @参数3 {String} value2  替代占位符{1}的字符串，以此类推

     * @返回值 {String} 格式化好的字符串

     * @静态方法

     */

    format : function(format){

        var args = Array.prototype.slice.call(arguments, 1);

        return format.replace(/\{(\d+)\}/g, function(m, i){

            return args[i];

        });

    }

});

/*工具方法，帮助你轻松地在两个字符串之间轮换取值。

*传入的第一个参数值会与当前字符串进行比较，如果它们相等，则把当前字符串赋值*为传入的第二个参数。否则，保持当前值不变。

*注意，该方法会返回一个新的字符串，而不是去改变当前字符串。

 * <pre><code>

// alternate sort directions

sort = sort.toggle('ASC', 'DESC');

 

// instead of conditional logic:

sort = (sort == 'ASC' ? 'DESC' : 'ASC');

</code></pre>

 * @参数1 {String} value 需要与当前值进行比较的字符串

 * @参数2 {String} other 如当前字符串与第一个传入的参数相等，赋值给当前字符串的新值。

 * @返回值 {String} 新的字符串

 */

String.prototype.toggle = function(value, other){

    return this == value ? other : value;

};

 

/**

 * 去掉字符串两端的空格,保持中间的空格不变。示例：

 * <pre><code>

var s = '  foo bar  ';

alert('-' + s + '-');         //alerts "- foo bar -"

alert('-' + s.trim() + '-');  //alerts "-foo bar-"

</code></pre>

 * @返回值 {String} 去掉两端空格后的字符串

 */

String.prototype.trim = function(){

    var re = /^\s+|\s+$/g;

    return function(){ return this.replace(re, ""); };

}();

 

format() 方法的工作机制：

对 String 的扩展代码比较清晰，也很好理解，里面这个 format() 方法倒是有点味道，笔者思虑半天没有明白它的机制，知道的高手请指点，万谢！

分享到：
| 《仔仔细细分析Ext》 Ext的事件机制源码详 ...
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics