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主体来达到删除前后字符串的效果。

附上最后的代码

<script>
// method1
String.prototype.trim = function(){
// return this.replace(/^\s+/, "").replace(/\s+$/, ""); // 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, "");
} var sTest1 = " this is a test sentence. ";
alert(sTest1.trim()); // method2
String.prototype.trim = function(){
return this.replace(/^\s+(.*?)\s+$/, "$1");
} var sTest2 = " this is a new sentence. ";
alert(sTest2.trim());
</script>

JavaScript中trim 方法实现的更多相关文章

  1. JavaScript中reduce()方法

    原文  http://aotu.io/notes/2016/04/15/2016-04-14-js-reduce/   JavaScript中reduce()方法不完全指南 reduce() 方法接收 ...

  2. JavaScript中的方法、方法引用和参数

    首先,我们来看一段代码,如果觉得不甚明白的,则本文会对你有益: var player = function (e) {             return (function f(m) {      ...

  3. 详解 JavaScript 中 splice() 方法

    splice() 方法是一个比较少用的方法,但是功能确实很好,并且在我们 coding 的时候,经常有需要 splice() 方法,先介绍一下该方法. 在 JavaScript 中 splice() ...

  4. JavaScript中的方法

    JavaScript中的方法 在JavaScript中,可以通过对象来调用对应的方法.在JavaScript中,有三个重要的window对象方法:用于显示警告信息的alert.用于显示确认信息的con ...

  5. JavaScript中Array方法总览

    title: JavaScript中Array方法总览 toc: true date: 2018-10-13 12:48:14 push(x) 将x添加到数组最后,可添加多个值,返回数组长度.改变原数 ...

  6. javascript中concat方法深入理解

    最近在恶补js知识的时候,总是会因为js强大的语法而感到震撼.因为以前对前端方面的疏忽,导致了一些理解的错误.因此痛改前非,下定决心,不管做什么事情,都要有专研的精神. 在介绍前,抛出一个问题:如何将 ...

  7. JavaScript中的方法重载

    对js有些了解的人都知道,在js中根本就不存在像C#中的那种方法重载,而有的只是方法的覆盖,当你在js中敲入两个或多个同名的方法的时候,不管方法(函数)的参数个数怎么个不同,这个方法名只能属于最后定义 ...

  8. 仿javascript中confirm()方法的小插件

    10天没有写博客了,不知道为什么,心里感觉挺不舒服的,可能这是自己给自己规定要去完成的事情,没有按照计划执行,总会心里不怎么舒服.最近事情挺多的,终于今天抽空来更新一下博客了. 今天写的是一个小插件. ...

  9. JavaScript 中 replace方法 替换所有字符串

    需要替换一个字符串中所有的某个字符串 java中使用replaceAll()方法就可以了.但是JavaScript中没有replaceAll方法 但是可以通过以下方法实现: /** * 空格替换为下划 ...

随机推荐

  1. Microsoft office(1)分页符和分节符

    Microsoft office下的页面布局中的分页符和分节符的区别: 分页符:标记一页的终止并开始下一页的点 分节符:插入分节符并在下一页开始新节 一般情况下,分节符在分页符外围,分节符一般是各种格 ...

  2. PostgreSQL配置文件--连接和认证

    1 连接和认证 CONNECTIONS AND AUTHENTICATION 1.1 连接 CONNECTIONS 1.1.1 listen_addresses 字符型 默认: listen_addr ...

  3. Chrome插件——一键保存网页为PDF1.0发布

    最新版本:V1.1 下载地址:http://download.csdn.net/detail/bdstjk/5722317 发布时间:2013-7-8 版本号:1.1.7.80 更新内容: 1.增加检 ...

  4. solr 统计频率(term frequency)

    1.统计单词在某个字段出现的频率次数 term frequency实现使用了function query. 例如统计‘公司’这个关键字在text这个字段中出现的次数 在返回的时候进行计算统计,即在返回 ...

  5. Hadoop Trash回收站使用指南

    转载:https://blog.csdn.net/sunnyyoona/article/details/78869778 我们在删除一个文件时,遇到如下问题,提示我们不能删除文件放回回收站: sudo ...

  6. angular directive 的controllerAs的用法

    原文: https://stackoverflow.com/questions/31857735/using-controlleras-with-a-directive --------------- ...

  7. HAWQ技术解析(四) —— 启动停止

            前面已经完毕了HAWQ的安装部署,也了解了HAWQ的系统架构与主要组件,以下開始使用它. HAWQ作为Hadoop上的一个服务提供给用户,与其他全部服务一样.最主要的操作就是启动.停止 ...

  8. 使用Unity3D的50个技巧:Unity3D最佳实践

    转自:http://www.tuicool.com/articles/buMz63I  刚开始学习unity3d时间不长,在看各种资料.除了官方的手册以外,其他人的经验也是非常有益的.偶尔看到老外这篇 ...

  9. Python——描述符(descriptor)解密

    本文由 极客范 - 慕容老匹夫 翻译自 Chris Beaumont.欢迎加入极客翻译小组,同我们一道翻译与分享.转载请参见文章末尾处的要求. Python中包含了许多内建的语言特性,它们使得代码简洁 ...

  10. 基于Jekyll的博客模板

    代码地址如下:http://www.demodashi.com/demo/13147.html 效果 环境配置 环境 Windows 10 Git Bash 安装ruby 下载rubyinstalle ...