JavaScript 字符串去除前后空格 trim 方法的多种实现方案
本文详细介绍 JavaScript 中去除字符串前后空格的多种实现方式,包括原生 String.prototype.trim 方法的使用及兼容性处理。同时深入解析四种自定义实现方案:基于正则表达式的替换、兼容 Unicode 的空格处理、支持自定义字符的 trim 扩展,以及不使用正则的手动指针截取法。文章对比了各方法的优缺点与适用场景,帮助开发者根据实际需求选择最优解。
引言与概述
在学习 JavaScript 时,了解如何高效去除字符串前后空格是一个常见需求。通过扩展内置对象或自定义函数,可以方便地实现这一功能。本文将分享几种常见的实现思路与代码示例。
原生 String.prototype.trim 方法
String.prototype.trim()
该内置方法返回一个新字符串,其两端的前后空白字符已被移除,而原始字符串保持不变。
/*内置对象添加方法:String.prototype.trim(给String添加一个trim方法) *^这个是以什么什么开头 *$这个是以什么什么结尾 *‘/s是String /d是数字' *replace(/^\s+/ , "")把以字符开头的字符串替换为空字符串, *replace(/\s+$/ , "")把以字符结尾的字符串替换为空字符串, */
基础正则实现方案
String.prototype.trim = function(){
return this.replace(/^\s+/ , "").replace(/\s+$/ , "");
}
第一种实现方式:理论上算是比较不错的
具体的可以查看这篇文章:
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/String/trim
兼容 Unicode 的空格处理
if (!String.prototype.trim) {
String.prototype.trim = function () {
return this.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, '');
};
}
第二种实现方式
从国内网站看到的,测试没问题,推荐使用
支持自定义字符的扩展实现
String.prototype.trim = function(a) {
var b = (this + "").replace(/(^[ \t\n\r\f\x0b\xa0]*)|([ \t\n\r\f\x0b\xa0]*$)/g, "");
a && (a = (a + "").replace(/([\[\]\(\)\.\?\/\*\{\}\+\$\^\:])/g, "\\$1"), b = b.replace(new RegExp("(^[" + a + "]*)|([" + a + "]*$)", "g"), ""));
return b
};
第三种、范围有点小,推荐学习,不推荐使用
简化正则替换方案
String.prototype.trim = function(){
//用正则表达式将前后空格用空字符串替代。
return this.replace(/(^\s*)|(\s*$)/g,"");
}
第四种,不用正则实现
不使用正则的手动截取方案
var str = " ac c ";
//使用String prototype 给用添加自定义方法。
String.prototype.trim = function(){
var start = 0;
var end = code.length-1;
while(start<=end && this.charAt(start) == ' '){
start++;
}
while(start<=end && this.charAt(end) == ' '){
end--;
}
//使用字符截取指定字符
return this.substring(start,end+1);
};
//使用原型直接调用
console.log("--"+str.trim()+"--")
推荐使用第一种、第二种方法。
下面是其他网友的补充,大家可以参考一下
今天呢 知乎看到一道题 说是网易面试题,要求自己写一个trim()方法,
实现 var str = " a sd "; 去掉字符串两端的空格。
直接上码
基于数组操作的实现方案
var str = " a sd ";
function trim (st) {
// 先把字符串分割成数组
var arr = st.split("");
// 从前面删除空格
for (let i = 0; i < arr.length; i++) {
// 如果数组元素是空格则删除
if (arr[i] === " ") {
arr.shift();
/*console.log(arr.length, i)*/
// 如果当前元素的下一项不是空格退出循环
if (arr[i+1] !== " ") {
break;
}
}
}
// 后前面删除空格
for (let i = arr.length; i >= 0; i--) {
// 如果数组元素是空格则删除
if (arr[i-1] === " ") {
arr.pop();
// 如果当前元素的前一项不是空格退出循环
if (arr[i-2] !== " ") {
break;
}
}
}
arr = arr.join("");
/*console.log(arr);*/
return arr;
}
var a = trim(str);
console.log(a); //a sd//
原理注释写的很清楚
不用正则实现的代码
左右分别处理的组合方案
function trim(s){
return trimRight(trimLeft(s));
}
//去掉左边的空白
function trimLeft(s){
if(s == null) {
return "";
}
var whitespace = new String(" \t\n\r");
var str = new String(s);
if (whitespace.indexOf(str.charAt(0)) != -1) {
var j=0, i = str.length;
while (j < i && whitespace.indexOf(str.charAt(j)) != -1){
j++;
}
str = str.substring(j, i);
}
return str;
}
//去掉右边的空白
function trimRight(s){
if(s == null) return "";
var whitespace = new String(" \t\n\r");
var str = new String(s);
if (whitespace.indexOf(str.charAt(str.length-1)) != -1){
var i = str.length - 1;
while (i >= 0 && whitespace.indexOf(str.charAt(i)) != -1){
i--;
}
str = str.substring(0, i+1);
}
return str;
}
function delrd(str){
var reg=/,$/gi;
str=str.replace(reg,"");
return str;
}
以上就是js String.prototype.trim字符去前后空格的扩展的详细内容,更多关于String对象增加一个trim方法的资料请关注本站其它相关文章!
JS运算符优先级与结合性的区别是什么?
2026-11-05 13:22:02
JS Map怎么只遍历Key或Value
2026-11-05 13:00:36
D3.js 与 ECharts 选型对比:灵活性 vs 开发效率
2026-11-05 09:45:01
为什么JS中typeof []返回object:数组类型检测误区解析
2026-11-04 19:50:47
D3.js 新手入门:环境搭建与第一个条形图实现
2026-11-04 10:49:48
