JavaScript中split不同分隔符对回文判断的影响及原因解析

问题场景 #

在实现忽略空格、标点的回文判断逻辑时，使用split(" ")处理字符串后调用reverse()未达到预期效果，错误代码如下：

const palindromes = (str) => {
    const regex = /[!"#$%&'()*+,-./:;<=>?@[\]^_`{|}~]/g;
    const cStr = str.toLowerCase().replace(regex, "").split(" ").join("");
    const revStr = cStr.split(" ").slice().reverse().join("");
    return cStr === revStr ? true : false;
};

问题原因 #

处理后的cStr已经通过split(" ").join("")移除了所有空格，此时再用split(" ")分割字符串，因为没有匹配的空格分隔符，会得到一个仅包含原字符串本身的单元素数组。对这个数组调用reverse()不会改变数组内容（单元素反转后还是自身），最终join("")后得到的字符串和原cStr完全一致，根本没实现反转字符的效果。

正确实现方式 #

改用split("")或扩展运算符[...cStr]将字符串拆分为单个字符的数组，再反转拼接即可：

// 方式1：split("")
const revStr = cStr.split("").slice().reverse().join("");

// 方式2：扩展运算符
const revStr = [...cStr].slice().reverse().join("");

split("")与split(" ")的核心差异 #

若分隔符为空字符串("")，字符串会被转换为包含每个UTF-16字符的数组，且数组两端无空字符串。

• split(" ")：以空格作为分隔符拆分字符串，只有当字符串中存在空格时才会拆分出多个元素；如果字符串无空格，返回的数组仅包含原字符串这一个元素。
• split("")：将字符串的每一个UTF-16字符拆分为数组的独立元素，比如"abc".split("")会得到["a","b","c"]，此时对数组反转就能实现字符顺序的颠倒。

相关参考内容翻译 #

• JavaScript数组反转不改变原数组：使用slice()方法可以创建原数组的浅拷贝，再对拷贝数组调用reverse()不会修改原数组内容
• 从字符串获取字符数组：通过split("")或扩展运算符[...str]都可以将字符串转换为单个字符组成的数组
• String.prototype.split()文档核心说明：当分隔符为空字符串时，字符串会被拆分为单个UTF-16字符的数组；当分隔符是空格且字符串中无空格时，返回仅含原字符串的单元素数组

内容的提问来源于stack exchange，提问作者user19062834