JavaScript去除字符串空格的多种实现方案与性能对比

基于正则表达式的常见实现

正则表达式是处理字符串最直观的工具，以下是几种典型的正则实现方案及其优缺点：

第1步：双重正则替换（基础版）

目的：利用浏览器对正则内部的优化，通过两次替换分别去除头部和尾部空格。

String.prototype.trim = function () {
    return this.replace(/^\s\s*/, '').replace(/\s\s*$/, '');
}

该实现看起来较为繁琐，实际速度却非常惊人。这主要得益于浏览器引擎对正则匹配的深度优化，例如字符串直接相加拼接比Array构建更快类似的内核机制。此类实现被base2等类库采用。

第2步：带前导假设的正则替换

目的：简化代码逻辑，适用于大部分已知包含空格的场景。

String.prototype.trim = function () {
    return this.replace(/^\s+/, '').replace(/\s+$/, '');
}

与第1步相似，但稍慢。原因是其设计初衷假设至少存在一个空白符，导致在非空格字符串上多了一次无效匹配检测。Prototype.js曾使用此逻辑，命名为 strip。

第3步：利用substring与search截取

目的：避免全量替换，仅提取有效内容区间。

String.prototype.trim = function () {
    return this.substring(
        Math.max(this.search(/\S/), 0), 
        this.search(/\S\s*$/) + 1
    );
}

通过 Math.max 确保起始位置不越界，search 定位非空白字符索引。该方法调用了四个原生方法，设计巧妙。速度略慢于前两种正则方案，但优于后续大多数纯正则方案。

第4步：单次正则全局替换（优雅版）

目的：利用候选操作符连接两个正则，追求代码简洁。

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

这是第2步的简化版，JQuery与mootools等主流库早期曾采用。虽然写法优雅，但由于失去了浏览器针对特定模式的内部优化机会，性能不及第3步。

复杂正则与替代方案的性能陷阱

随着算法复杂度增加，性能波动显著：

第5步：match与非捕获分组

String.prototype.trim = function () {
    var str = this;
    str = str.match(/\S+(?:\s+\S+)*/);
    return str ? str[0] : '';
}

利用 match 返回数组的特性获取匹配项，并使用非捕获分组 (?:exp) 防止中间空格被误判。由于浏览器在处理复杂分组回溯时存在性能瓶颈，此方法速度较慢，提示我们不应盲目迷信正则万能论。

第6-9步：反向引用与贪婪/懒惰匹配

以下三种实现均尝试将匹配到的有效部分保留至组内，再替换为空或保留组内容：

// 第6步：普通捕获分组（性能较差）
return this.replace(/^\s*(\S*(\s+\S+)*)\s*$/, '$1');

// 第7步：非捕获分组优化
return this.replace(/^\s*(\S*(?:\s+\S+)*)\s*$/, '$1');

// 第8步：字符集合与问号量化
return this.replace(/^\s*((?:[\S\s]*\S)?)\s*$/, '$1');

// 第9步：懒惰匹配
return this.replace(/^\s*([\S\s]*?)\s*$/, '$1');

实验数据显示，第8步利用 [\S\s] 字符集合和 ? 惰性匹配，在IE环境下实现了惊人的性能飞跃，而在Firefox中第9步的懒惰匹配表现更优。这表明不同浏览器内核对正则引擎的优化策略差异巨大。

极致性能：原生字符串方法组合

当需要突破正则性能瓶颈时，直接使用字符串原生方法是最佳选择。

第10步：全量字符列表遍历（神技版）

目的：完全摒弃正则，利用indexOf与substring进行二进制级别的快速截取。

String.prototype.trim = function () {
    var str = this,
        whitespace = ' \n\r\t\f\x0b\xa0\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u200b\u2028\u2029\u3000';
    for (var i = 0, len = str.length; i < len; i++) {
        if (whitespace.indexOf(str.charAt(i)) === -1) {
            str = str.substring(i);
            break;
        }
    }
    for (i = str.length - 1; i >= 0; i--) {
        if (whitespace.indexOf(str.charAt(i)) === -1) {
            str = str.substring(0, i + 1);
            break;
        }
    }
    return whitespace.indexOf(str.charAt(0)) === -1 ? str : '';
}

该实现将所有可能的空白字符显式列出，通过两次循环分别从头部和尾部剔除无效字符。全程仅使用 indexOf 和 substring，避免了正则引擎的回溯开销。实测中其在IE与Firefox中均能达到零毫秒级别，性能极佳，适合打造高性能类库。

第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.substring(0, i + 1);
            break;
        }
    }
    return str;
}

头部交给简单的正则 replace 处理（利用浏览器优化），尾部通过原生字符测试与截取完成。效果媲美第10步，且代码更易读和维护。

第12步：While循环精简版

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);
}

结合了第1步的快速头部处理与尾部指针移动逻辑，写法最为简洁，性能同样达到极优水平。

常用字符串原型扩展工具集

除了基础的Trim，实际项目中常需以下字符串操作方法：

// 批量替换功能
String.prototype.ReplaceAll = function(A, B) {
    var C = this;
    for(var i = 0; i < A.length; i++) {
        C = C.replace(A[i], B[i]);
    }
    return C;
};

// 标准TRIM实现（兼容多类型空白）
String.prototype.Trim = function() {
    return this.replace(/(^[	

]*)|([	

]*$)/g,'');
};

// 左/右删除空格
String.prototype.LTrim = function() { return this.replace(/^[	

]/g,''); };
String.prototype.RTrim = function() { return this.replace(/[	

]*$/g,''); };

// 判断是否以指定字符串结束（支持忽略大小写）
String.prototype.EndsWith = function(A, B) {
    var C = this.length;
    var D = A.length;
    if(D > C) return false;
    if(B) {
        var E = new RegExp(A + '$', 'i');
        return E.test(this);
    } else return (D == 0 || this.substr(C - D, D) == A);
};

// 判断是否以指定字符串开始
String.prototype.StartsWith = function(str) {
    return this.substr(0, str.length) == str;
};

// 移除指定位置的字符
String.prototype.Remove = function(A, B) {
    var s = '';
    if(A > 0) s = this.substring(0, A);
    if(A + B < this.length) s += this.substring(A + B, this.length);
    return s;
};

总结与建议

对于日常业务开发，直接使用浏览器原生的 str.trim() 是最安全且高效的选择。若需兼容极老旧环境或定制特殊空白字符（如不间断空格  ），推荐参考上述实现。在性能敏感场景下，**实现10** 与 **实现12** 提供了近乎极限的速度；而在代码可读性与性能的平衡点上，**实现11** 是最佳 compromise。

以上就是JavaScript去掉空格的方法集合与性能分析的详细内容，更多关于JavaScript字符串操作技巧的资料请关注本站其它相关文章！