js 截取 中英文 混合

在JavaScript中截取包含中英文混合的字符串时，需要考虑到中文字符占用的字节长度与英文字符不同。中文字符通常占用两个字节，而英文字符占用一个字节。因此，简单的按字符索引截取可能会导致乱码或不准确的结果。

基础概念

• Unicode编码：现代编程语言中的字符串通常基于Unicode编码，它支持全球几乎所有的语言字符。
• UTF-8编码：一种针对Unicode的可变长度字符编码，能够表示Unicode标准中的任何字符。

相关优势

• 兼容性：UTF-8编码广泛支持，兼容ASCII编码。
• 灵活性：可以处理任意长度的文本，包括中英文混合。

类型与应用场景

• 字符串截取：在文本编辑器、聊天应用、网页显示等场景中经常需要对字符串进行截取。
• 字符计数：在某些情况下，需要准确计算字符串中的字符数量，而不是字节长度。

示例代码

以下是一个JavaScript函数，用于截取包含中英文混合的字符串，并确保不会截断中文字符：

function substringMixed(str, maxLength) {
    let len = 0;
    let result = '';
    for (let i = 0; i < str.length; i++) {
        const char = str[i];
        // 判断字符是否为中文
        const isChinese = /^[\u4e00-\u9fa5]$/.test(char);
        // 中文字符占两个字节，英文字符占一个字节
        len += isChinese ? 2 : 1;
        if (len <= maxLength) {
            result += char;
        } else {
            break;
        }
    }
    return result;
}

// 使用示例
const mixedStr = "Hello世界，这是一个测试。";
console.log(substringMixed(mixedStr, 10)); // 输出: "Hello世界"

遇到的问题及解决方法

问题：直接使用str.substring(startIndex, endIndex)可能会导致中文字符被截断，从而显示乱码。

原因：substring方法按字符索引工作，不考虑字符的字节长度。

解决方法：如上所示，自定义一个函数来逐个检查字符，并根据字符类型（中文或英文）累加字节长度，直到达到所需的字节长度为止。

通过这种方式，可以确保在截取字符串时不会破坏中文字符的完整性，从而避免出现乱码问题。