JS trim去空格的最佳实践


Posted in Javascript onOctober 30, 2011

刚好上次有同学提出疑问。刚好可以自测一下。先来看看老道在《JavaScript 精粹》P33 写的吧。他对 String 对象扩展了一个 trim() 方法:

Function.prototype.method = function(name, func) { 
this.prototype[name] = func; 
return this; 
}; String.method('trim', function() { 
return this.replace(/^\s+|\s+$/g, ''); 
});

熟悉吧,/^\s+|\s+$/g,这样的正则表达式。多少框架在用呢。比如 jQuery 的 trimLeft, trimRight:
// Used for trimming whitespace 
trimLeft = /^\s+/, 
trimRight = /\s+$/,

这是最佳实践么?但我们框架使用的不是这种方法(暂且称为半正则方法)。上次在其他产品组在内部 PK 的时候,说过,为什么我们框架要用下面这样的方法来实现 trim(),而不是用上面的那种。
trim: function(){ 
var str = this.str.replace(/^\s+/,''); 
for(var i= str.length - 1; i >= 0; i--){ 
if(/\S/.test(str.charAt(i))){ 
str = str.substring(0,i+1); 
break; 
} 
} 
return str; 
}

原因工友已经说了,因为正则的反向匹配比较慢。我对其性能进行了对比。综合速度和写法上来说,个人还是偏向于第一种写法。因为速度其实相差很少很少。从代码来说第二种比较晦涩并且并字节很多,这对于一个流量很高但需要用 trim() 很少的网站来说,第一种明显比较合适,看看下面的测试结果(自已测试,猛击这里):

JS trim去空格的最佳实践

啊?原来不是半正则的方式最快啊?是的,其实很多高级浏览器中已经默认提供 trim() 了。速度就不用说了,100 倍?哈哈哈。最后,方案如下:

if(!String.prototype.trim){ 
String.prototype.trim = function(){ 
return this.replace(/^\s+|\s+$/g, ''); 
} 
}
Javascript 相关文章推荐
JavaScript 编程引入命名空间的方法与代码
Aug 13 Javascript
页面只能打开一次Cooike如何实现
Dec 04 Javascript
js+css实现上下翻页相册代码分享
Aug 18 Javascript
基于jquery实现省市联动效果
Nov 23 Javascript
炫酷的js手风琴效果
Oct 13 Javascript
详解Vue2 无限级分类(添加,删除,修改)
Mar 07 Javascript
ES6新特性二:Iterator(遍历器)和for-of循环详解
Apr 20 Javascript
深入理解Angularjs中$http.post与$.post
May 19 Javascript
Django中使用jquery的ajax进行数据交互的实例代码
Oct 15 jQuery
jQuery图片查看插件Magnify开发详解
Dec 25 jQuery
使用mpvue搭建一个初始小程序及项目配置方法
Dec 03 Javascript
彻底揭秘keep-alive原理(小结)
May 05 Javascript
js中更短的 Array 类型转换
Oct 30 #Javascript
JavaScript Array Flatten 与递归使用介绍
Oct 30 #Javascript
关于图片按比例自适应缩放的js代码
Oct 30 #Javascript
js 弹出菜单/窗口效果
Oct 30 #Javascript
基于Jquery+Ajax+Json的高效分页实现代码
Oct 29 #Javascript
简单的前端js+ajax 购物车框架(入门篇)
Oct 29 #Javascript
分享一个自己写的table表格排序js插件(高效简洁)
Oct 29 #Javascript
You might like
浅谈apache和nginx的rewrite的区别
2013/02/22 PHP
PHP5.5安装PHPRedis扩展及连接测试方法
2017/01/22 PHP
通过实例解析PHP数据类型转换方法
2020/07/11 PHP
JavaScript 乱码问题
2009/08/06 Javascript
JS获取父节点方法
2009/08/20 Javascript
javascript 添加和移除函数的通用方法
2009/10/20 Javascript
jQuery Jcrop插件实现图片选取功能
2011/11/23 Javascript
Javascript Request获取请求参数如何实现
2012/11/28 Javascript
学做Bootstrap的第一个页面
2016/05/15 HTML / CSS
Bootstrap实现提示框和弹出框效果
2017/01/11 Javascript
总结js函数相关知识点
2018/02/27 Javascript
在Vue项目中使用d3.js的实例代码
2018/05/01 Javascript
react build 后打包发布总结
2018/08/24 Javascript
浅谈vue项目打包优化策略
2018/09/29 Javascript
vue 进阶之实现父子组件间的传值
2019/04/26 Javascript
原生JS 实现的input输入时表格过滤操作示例
2019/08/03 Javascript
[07:47]DOTA2国际邀请赛采访专栏:探访Valve总部
2013/08/08 DOTA
Python中的super用法详解
2015/05/28 Python
python下如何查询CS反恐精英的服务器信息
2017/01/17 Python
Django基础之Model操作步骤(介绍)
2017/05/27 Python
Python实现读取Properties配置文件的方法
2018/03/29 Python
Python Numpy计算各类距离的方法
2019/07/05 Python
python 定时器每天就执行一次的实现代码
2019/08/14 Python
pytorch 输出中间层特征的实例
2019/08/17 Python
nginx搭建基于python的web环境的实现步骤
2020/01/03 Python
Python读写操作csv和excle文件代码实例
2020/03/16 Python
英国绿色商店:Natural Collection
2019/05/03 全球购物
Structs界面控制层技术
2013/10/11 面试题
优秀研究生自我鉴定
2013/12/04 职场文书
市场开发与营销专业求职信
2013/12/31 职场文书
环保标语大全
2014/06/12 职场文书
户籍证明模板
2014/09/28 职场文书
2014酒店客房部工作总结
2014/12/16 职场文书
个人求职自荐信范文
2015/03/06 职场文书
发言稿之优秀教师篇
2019/09/26 职场文书
JavaScript 原型与原型链详情
2021/11/02 Javascript