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. vertica数据库怎么查看连接数是否已经达到最大值

  2. ORA-12537:TNS连接已关闭

      安装完11i的VIS版本后,客户端连接数据时会报“ORA-12537:TNS连接已关闭”,在网上找到以下解决办法: 今天在远程客户端配置EBS数据库连接的时候发生“ORA-12537:TNS连接已 ...

  3. centos7 安装nginx与配置

    第一步安装 使用Yum安装是推荐的方式,整体的流程非常的简单,也不容易出错,如果不需要什么特殊配置,建议使用Yum尽进行安装. 第一种安装方式,通过添加epel源 yum install epel-r ...

  4. 两列布局(浮动、定位、flex)和三列布局(圣杯、双飞翼、flex)

    demo 各种布局演示 https://jsfiddle.net/mayufo/qp890peq/1/ 两栏布局 浮动 <div class="box1"> <d ...

  5. opencv提取surf特征点出现的错误

    opencv实现surf特征的提取.本来是一个非常easy的代码,结果我执行时却出现了各种错误,以下来谈谈我出现的错误及问题的解决过程. 首先,我把提取surf特征的过程整合成了一个函数,我单独建立一 ...

  6. REDIS 内存满时删除策略

    REDIS 内存满时删除策略

  7. activiti入门3排他网关,并行网管,包括网关,事件网关

    网关用来控制流程的流向 网关能够消费也能够生成token. 网关显示成菱形图形,内部有有一个小图标. 图标表示网关的类型. 基本分支 首先 利用 流程变量  写个带有分支的一个基本流程 流程图: wa ...

  8. LRU的C++实现引申出的迭代器问题

    leetcode上刷题.碰到一题实现LRU算法的题目. LRU,Least recently used.是一种常见的cache和页面替换算法.算法和原理可以参阅相关wiki. leetcode上的这一 ...

  9. 《DirectX 9.0 3D游戏开发编程基础》 第二章 绘制流水线 读书笔记

    模型的表示 场景:物品或模型的集合 任何物品都可以用三角形网络逼近表示.我们经常用以下术语描述三角形网络:多边形(polygons).图元(primitives).网络几何单元(mesh geomet ...

  10. Hive 作业优化

    1.Join原则将条目少的表/子查询放在 Join的左边. 原因是在 Join 操作的 Reduce 阶段,位于 Join左边的表的内容会被加载进内存,将条目少的表放在左边,可以有效减少发生内存溢出的 ...