码迷,mamicode.com
首页 > 编程语言 > 详细

JavaScript中trim 方法实现

时间:2015-03-12 22:35:52      阅读:184      评论:0      收藏:0      [点我收藏+]

标签:javascript   trim   prototype   replace   正则表达式   


    Java中的 String 类有个trim() 可以删除字符串前后的空格字符,jQuery中也有trim()方法可以删除字符变量前后的字符串。但是JavaScript中却没有相应的trim() 方法,幸好,JavaScript中有正则表达式,String 对象有replace() 方法,利用JavaScript的正则和replace方法来达到trim() 方法的效果。


    接下来介绍两种方法,其实两种方法大同小异。都是在String 对象的prototype属性上进行trim()方法的定义,并提供实现,实现后,便可以通过String对象名.trim()来删除字符串前后的空格字符了。


String.prototype.trim = function() {
    // TODO
}


method1 前后空格字符分别替换

   

    JavaScript的String 对象有replace方法,可以对String 对象中的字符进行替换,这里我们利用String 对象的replace方法,对前后的空字符串分别替换,达到整体的删除空字符串的效果。


String.prototype.trim = function(){
	return this.replace(/^\s+/, "").replace(/\s+$/, "");
}

var sTest1 = "   this is a test sentence.    ";
alert(sTest1.trim());


    解释下trim() 方法的具体方法体

        this 在方法内代表的是当前对象

        this后面的第一个replace删除的是字符串前面的空格字符

        其中 /^\s+/ 表示的是开头的1到多个空格字符,这个正则是Perl风格

        也可以用RegExp对象替换,可以修改为


var regObj = new RegExp("^\\s+");
return this.replace(regObj, "").replace(/\s+$/, "");

   

    这里我们只是将匹配前面空格字符的正则表达式方式修改了


          同样也可以替换掉后面的正则方式,最后的代码为

var regObj1 = new RegExp("^\\s+");
var regObj2 = new RegExp("\\s+$");
return this.replace(regObj1, "").replace(regObj2, "");

method2 前后空格整体替换

   

    整体替换方式与前面的分别替换大同小异,前面是两次replace,用两个正则来分别匹配前面和后面的空格字符,整体替换时,用一个正则表达式,来替换掉前面的空格字符。


String.prototype.trim = function(){
	return this.replace(/^\s+(.*?)\s+$/, "$1");
}

var sTest2 = "   this is a new sentence.    ";
alert(sTest2.trim());


    这里return this.replace(/^\s+(.*?)\s+$/, "$1");

    使用一个正则/^\s+(.*?)\s+$/匹配了前后的空格字符,后面的$1为正则表达式反向引用的结果

    $1 就代表(.*?) 的值,即删除前后空格的要返回的字符串

 

    这里的正则方式也可以修改为RegExp 的方式,这里我就不修改了。

 

    上面介绍的两种方法,都是通过给String 对象的prototype 属性上定义新的方法来完成的。

    这里也可以不定义新的trim() 方法,直接通过方法体里面的replace主体来达到删除前后字符串的效果。

 




JavaScript中trim 方法实现

标签:javascript   trim   prototype   replace   正则表达式   

原文地址:http://blog.csdn.net/magi1201/article/details/44228011

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!