JavaScript中padStart()填充emoji时计数不符合预期的原因

核心原因是JavaScript字符串底层采用UTF-16编码存储，所有原生字符串长度计算逻辑——包括padStart()、padEnd()的长度阈值判断、字符串自带的length属性——都是以UTF-16码元为计数单位，而非以人眼感知的单个视觉字符（Unicode码点）为计数单位。

• 普通键盘符号比如$属于Unicode基本多语言平面（BMP）字符，码点范围在U+0000~U+FFFF之间，仅需1个UTF-16码元即可存储，计数时占1个单位。因此填充目标长度为20时，刚好可以放下20个$。
• 测试用的南瓜emoji🎃Unicode码点为U+1F383，属于辅助平面字符，超出了单个UTF-16码元的可表示范围，必须通过两个UTF-16码元组成的「代理对」才能存储，计数时会被算作2个单位。

直接运行代码就能验证两者的计数差异：

console.log("$".length); // 输出 1
console.log("🎃".length); // 输出 2

调用"".padStart(20, "🎃")时，方法会持续拼接填充字符串，直到字符串总UTF-16码元长度达到20就终止填充。单个emoji占2个码元，最终自然只能得到10个emoji，总码元长度刚好凑够20。

如果需要按视觉字符计数、填充得到20个emoji，可以按Unicode码点拆分构造字符串：

// 正确生成20个南瓜emoji
const emojiFill = Array.from({ length: 20 }, () => "🎃").join("");
console.log(emojiFill); // 输出20个🎃

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