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 相关文章推荐
CutePsWheel javascript libary 控制输入文本框为可使用滚轮控制的js库
Feb 07 Javascript
JavaScript类和继承 this属性使用说明
Sep 03 Javascript
jquery清空textarea等输入框实现代码
Apr 22 Javascript
深入理解JavaScript系列(29):设计模式之装饰者模式详解
Mar 03 Javascript
jQuery实现高亮显示的方法
Mar 10 Javascript
JavaScript学习小结之使用canvas画“哆啦A梦”时钟
Jul 24 Javascript
AngularJS 过滤器的简单实例
Jul 27 Javascript
Bootstrap常用组件学习(整理)
Mar 24 Javascript
微信小程序实践之动态控制组件的显示/隐藏功能
Jul 18 Javascript
vue 自动化路由实现代码
Sep 03 Javascript
webpack 如何解析代码模块路径的实现
Sep 04 Javascript
微信小程序实现滚动Tab选项卡
Nov 16 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
PHP中register_globals参数为OFF和ON的区别(register_globals 使用详解)
2012/02/05 PHP
php用户登录之cookie信息安全分析
2016/05/13 PHP
ThinkPHP使用getlist方法实现数据搜索功能示例
2017/05/08 PHP
js变量作用域及可访问性的探讨
2006/11/23 Javascript
身份证号码前六位所代表的省,市,区, 以及地区编码下载
2007/04/12 Javascript
AJAX异步从优酷专辑中采集所有视频及信息(JavaScript代码)
2010/11/20 Javascript
js控制表单奇偶行样式的简单方法
2013/07/31 Javascript
javascript无刷新评论实现方法
2015/05/13 Javascript
javascript 应用小技巧方法汇总
2015/07/05 Javascript
jQuery如何封装输入框插件
2016/08/19 Javascript
微信小程序 wx.request(OBJECT)发起请求详解
2016/10/13 Javascript
js前端实现图片懒加载(lazyload)的两种方式
2017/04/24 Javascript
jQuery用户头像裁剪插件cropbox.js使用详解
2017/06/07 jQuery
JS实现将对象转化为数组的方法分析
2019/01/21 Javascript
JavaScript学习教程之cookie与webstorage
2019/06/23 Javascript
layui自定义插件citySelect实现省市区三级联动选择
2019/07/26 Javascript
jQuery实现电梯导航模块
2020/12/22 jQuery
手动实现vue2.0的双向数据绑定原理详解
2021/02/06 Vue.js
python模拟新浪微博登陆功能(新浪微博爬虫)
2013/12/24 Python
python删除文件示例分享
2014/01/28 Python
Python中使用Tkinter模块创建GUI程序实例
2015/01/14 Python
Python实现将doc转化pdf格式文档的方法
2018/01/19 Python
django实现类似触发器的功能
2019/11/15 Python
tensorflow保持每次训练结果一致的简单实现
2020/02/17 Python
简单的Python人脸识别系统
2020/07/14 Python
Python之字符串的遍历的4种方式
2020/12/08 Python
美国第二大团购网站:LivingSocial
2016/07/24 全球购物
台湾最大网路书店:博客来
2018/03/18 全球购物
台湾东南旅游社网站:东南旅游
2019/02/11 全球购物
澳大利亚最受欢迎的超级商场每日优惠:Catch
2020/11/17 全球购物
《他得的红圈圈最多》教学反思
2014/04/24 职场文书
调查研究项目计划书
2014/04/29 职场文书
区政府领导班子个人对照检查材料
2014/09/25 职场文书
2015年超市员工工作总结
2015/05/04 职场文书
有关信念的名言语录集锦
2019/12/06 职场文书
一篇文章带你复习java知识点
2021/06/28 Java/Android