`
keepwork
  • 浏览: 334390 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

JS--去除空格的12种方法(兼容各种浏览器)

js 
阅读更多
JS去除空格的方法目前共有12种:

实现1

String.prototype.trim = function() {    return this.replace(/^\s\s*/, '').replace(/\s\s*$/, '');  }看起来不怎么样, 动用了两次正则替换,实际速度非常惊人,主要得益于浏览器的内部优化。一个著名的例子字符串拼接,直接相加比用Array做成的StringB?r 还快。base2类库使用这种实现。
实现2

String.prototype.trim = function() {    return this.replace(/^\s+/, '').replace(/\s+$/, '');  }和实现1 很相似,但稍慢一点,主要原因是它最先是假设至少存在一个空白符。Prototype.js使用这种实现,不过其名字为strip,因为 Prototype的方法都是力求与R y同名。
实现3

String.prototype.trim = function() {    return  this.s string(Math.max(this.search(/\S/), 0),this.search(/\S\s*$/) + 1);  }以截取方式取得空白部分(当然允许中间存在空白符),总共 调用了四个原生方法。设计得非常巧妙,s string以两个数字作为参数。Math.max以两个数字作参数,search则返回一个数字。速度比上 面两个慢一点,但比下面大多数都快。
实现4

String.prototype.trim = function() {    return  this.replace(/^\s+|\s+$/g, '');  }这个可以称得上实现2的简化版,就是 利用候选操作符连接两个正则。但这样做就失去了浏览器优化的机会,比不上实现3。由于看来很优雅,许多类库都使用它,如JQry与mootools

实现5

String.prototype.trim = function() {    var str = this;    str = str.match(/\S+(?:\s+\S+)*/);    return str ? str[0] : '';  }match 是返回一个数组,因此原字符串符合要求的部分就成为它的元素。为了防止字符串中间的空白符被排除,我们需要动用到非捕获性分组(?:exp)。由于数组可 能为空,我们在后面还要做进一步的判定。好像浏览器在处理分组上比较无力,一个字慢。所以不要迷信正则,虽然它基本上是万能的。

实现6

String.prototype.trim = function() {    return this.replace(/^\s*(\S*(\s+\S+)*)\s*$/, '$1');  }把符合要求的部分提供出来,放到一个空字符串中。不过效率很差,尤其是在IE6中。
实现7

String.prototype.trim = function() {    return this.replace(/^\s*(\S*(?:\s+\S+)*)\s*$/, '$1');  }和实现6很相似,但用了非捕获分组进行了优点,性能效之有一点点提升。


实现8

String.prototype.trim = function() {    return this.replace(/^\s*((?:[\S\s]*\S)?)\s*$/, '$1');  }沿着上面两个的思路进行改进,动用了非捕获分组与字符集合,用?顶替了*,效果非常惊人。尤其在IE6中,可 以用疯狂来形容这次性能的提升,直接秒杀火狐。

实现9

String.prototype.trim = function() {    return this.replace(/^\s*([\S\s]*?)\s*$/, '$1');  }这次是用懒惰匹配 顶替非捕获分组,在火狐中得到改善,IE没有上次那么疯狂。


实现10

String.prototype.trim = function() {    var str = this,    whitespace = ' \n\r\t\f\x0b\xa0\?\?\?\?\?\?\?\?\?\?\?\?\?\?\ ';    for (var i = 0,len = str.length; i < len; i++) {      if (whitespace.indexOf(str.charAt(i)) === -1) {        str = str.s string(i);        break;      }    }    for (i = str.length - 1; i >= 0; i--) {      if (whitespace.indexOf(str.charAt(i)) === -1) {        str = str.s string(0, i + 1);        break;      }    }    return whitespace.indexOf(str.charAt(0)) === -1 ? str : '';  }  我 只想说,搞出这个的人已经不是用牛来形容,已是神一样的级别。它先是把可能的空白符全部列出来,在第一次遍历中砍掉前面的空白,第二次砍掉后面的空白。全 过程只用了indexOf与s string这个专门为处理字符串而生的原生方法,没有使用到正则。速度快得惊人,估计直逼上内部的二进制实现,并且在 IE与火狐(其他浏览器当然也毫无疑问)都有良好的表现。速度都是零毫秒级别的。
实现11

String.prototype.trim = function() {    var str = this,    str = str.replace(/^\s+/, '');    for (var i = str.length - 1; i >= 0; i--) {      if (/\S/.test(str.charAt(i))) {        str = str.s string(0, i + 1);        break;      }    }    return str;  }实现10已经告诉我们普通的原生字符串截取方法是远胜于正则替换,虽然是复杂一点。但只要正则 不过于复杂,我们就可以利用浏览器对正则的优化,改善程序执行效率,如实现8在IE的表现。我想通常不会有人在项目中应用实现10,因为那个 whitespace 实现太长太难记了(当然如果你在打造一个类库,它绝对是首先)。实现11可谓其改进版,前面部分的空白由正则替换负责砍掉,后面用原生方法处理,效果不逊 于原版,但速度都是非常逆天。
实现12

String.prototype.trim = function() {    var str = this,    str = str.replace(/^\s\s*/, ''),    ws = /\s/,    i = str.length;    while (ws.test(str.charAt(--i)));    return str.slice(0, i + 1);  }实现10与实现11在写法上更好的改进版,注意说的不是性能速 度,而是易记与使用上。和它的两个前辈都是零毫秒级别的,以后就用这个来工作与吓人。

 开发者博客www.developsearch.com

分享到:
评论

相关推荐

    javascript 取Url参数和去掉字符串前后空格方法

    ### JavaScript 获取URL参数和去除字符串前后空格的方法 在日常的Web开发中,经常会遇到需要获取URL中的参数或处理字符串的情况。例如,在用户点击某个链接或者表单提交后,我们可能需要从URL中提取出某些特定的...

    javascript去掉两边空格

    `trim()` 方法不仅限于去掉空格,还可以去掉其他空白字符,包括制表符(`\t`)、换行符(`\n`)、回车符(`\r`)等。以下是一个包含多种空白字符的示例: ```javascript let str = " \t\n Hello World! \r\n "; let...

    css浏览器兼容整理

    ### CSS浏览器兼容性整理 #### 一、IE6/IE7/IE8/Firefox/Chrome/Safari的CSShack兼容一览表 为了确保网站能在不同的浏览器中呈现出一致的效果,了解和掌握各种CSS hack技巧是非常重要的。以下是一些常用且有效的...

    js去字符串前后空格5种实现方法及比较.docx

    同时,JavaScript ES6引入了`String.prototype.trim()`、`String.prototype.trimStart()`和`String.prototype.trimEnd()`方法,它们分别对应去除全部、左侧和右侧空格,这些原生方法在现代浏览器中支持良好,可以...

    Js中去掉空格经典代码

    ### Js中去掉空格经典代码 在Web开发中,经常需要对用户输入的数据进行处理,其中一个常见的需求就是去除字符串中的空白字符(包括空格、制表符等)。JavaScript提供了多种方法来实现这一功能,其中自定义扩展...

    JavaScript去除空格的三种方法(正则/传参函数/trim)

    本文将详细介绍在JavaScript中去除字符串中空格的三种方法,包括使用正则表达式、传参函数以及JavaScript内置的String.prototype.trim()方法。 首先,正则表达式是处理字符串的强大工具,它允许你进行复杂的模式...

    js去字符串前后空格的实现方法.docx

    本文将详细介绍几种常见的JavaScript去除字符串前后空格的方法,并对比它们的优缺点。 #### 方法一:循环检查替换 这种方法通过循环遍历字符串,找到第一个非空格字符的位置,然后截取该位置到字符串末尾的部分作为...

    前端开源库-asset-pipe-js-writer

    1. **代码预处理**:支持ES6+语法转换,让开发者可以使用最新的JavaScript特性,而不用担心浏览器兼容性问题。 2. **模块打包**:能够将多个JavaScript模块整合成一个或几个文件,减少HTTP请求,提高页面加载速度。 ...

    js-trim()方法IE无效的解决办法

    ### js-trim()方法IE无效的解决办法 在JavaScript中,`trim()`方法主要用于去除字符串首尾的空白字符。此方法在现代浏览器中通常能够很好地工作,但在Internet Explorer(IE)的一些版本中可能存在兼容性问题。这是...

    浏览器兼容问题

    浏览器兼容问题在IT行业中是一个长期存在的挑战,尤其是在JavaScript应用开发中。由于不同的浏览器,如Internet Explorer、Firefox、Chrome、Safari等,对Web标准的支持程度不一,导致开发者需要针对不同的浏览器...

    JS去除字符串中空格的方法

    以上就是JavaScript中去除字符串空格的几种常见方法。除此之外,JavaScript的字符串处理功能十分强大,还包括很多其他技巧,如: - JavaScript正则表达式技巧:包括正则表达式的创建、测试和应用等。 - JavaScript...

    前端开源库-qycloud-optimizer-uglify-js

    2. **去除空格和换行**:压缩后的代码将移除多余的空格和换行符,进一步减小文件大小。 3. **变量重命名**:将未声明或未使用的变量删除,同时将可变变量名替换为更短的形式,如a、b等,以达到最小化的目的。 4. **...

    javasrcipt去字符串空格

    ### JavaScript去除字符串中的空格 在JavaScript开发过程中,经常需要处理字符串数据,其中就包括了对字符串中的空格进行操作。本篇文章将详细介绍如何在JavaScript中去除字符串中的空格,并探讨不同的方法及其适用...

    JS去掉字符串前后空格或去掉所有空格的用法

    对于只使用原生JavaScript去除字符串两端的空格,可以使用`String.prototype.trim()`方法。例如,`var str = "abcd".trim();`将返回去掉首尾空格后的字符串`abcd`。 当需要去除字符串中所有空格(包括首尾和中间的...

    js设置兼容trim函数

    ### js设置兼容trim函数 #### 知识点一:JavaScript中的`trim()`方法 `trim()` 方法用于删除字符串两端的空白字符(包括空格、制表符、换页符等)。此方法不会改变原始字符串,而是返回一个新的字符串。 **语法**...

    tinypinyin轻量的汉字转拼音JavaScript库可以轻松获取汉字的拼音

    在IT行业中,JavaScript是一种广泛使用的前端编程语言,它在网页开发、移动应用、服务器端运行环境等场景下都有着广泛的应用。对于处理汉字和拼音转换的需求,`tiny-pinyin`库提供了一个轻量级的解决方案。这个...

    js 去掉字符串前后空格实现代码集合

    JavaScript(简称js)中去除字符串前后空格的实现方法是前端开发中常见的需求,主要通过编写自定义函数或利用已有库函数来实现。以下是几种常见方法的详细说明: 1. 循环检查替换方法 - 这种方法通过循环检查字符...

    js框架jquery+layer弹窗实现登录、转动抽奖程序代码,兼容多种浏览器源码.rar

    通过合理运用JavaScript和CSS3,可以在各种浏览器环境下提供一致的用户体验。对于初学者来说,这是一个很好的学习示例,可以从中了解到前端开发中常见组件的实现方式。对于开发者来说,这样的代码库可以作为快速构建...

    jquery-2.1.1.js 、jquery-2.1.1.min.js 【jquery包 js】

    jQuery的引入通常有两种形式:未压缩的`jquery-2.1.1.js`和压缩版的`jquery-2.1.1.min.js`。未压缩版本主要用于开发环境,便于调试和理解代码;而压缩版本则用于生产环境,通过去除空格、注释和简化变量名等方式减小...

Global site tag (gtag.js) - Google Analytics