javascript - 哪些字符与 Array.from 分组？

Question

我一直在玩 JS，但无法弄清楚 JS 在使用 Array.from() 时如何决定将哪些元素添加到创建的数组中.例如，以下表情符号 👍 有一个 length 2，因为它由两个代码点组成，但是，Array.from()将这两个代码点视为一个，给出一个包含一个元素的数组:

const emoji = '👍';
console.log(Array.from(emoji)); // Output: ["👍"]

但是，其他一些字符也有两个代码点，例如这个字符 षि (也有 .length 的 2 个)。但是， Array.from不“分组”这个字符，而是产生两个元素:

const str = 'षि';
console.log(Array.from(str)); // Output: ["ष", "ि"]

我的问题是:当字符由两个代码点组成时，是什么决定了字符是被分解(如示例二)还是被视为一个单一元素(如示例一)？

Answer 1

Array.from首先尝试调用参数的迭代器，如果它有一个，并且字符串确实有迭代器，所以它调用 String.prototype[Symbol.iterator] ，所以让我们看看原型(prototype)方法是如何工作的。在规范 here 中有描述:

1. Let O be ? RequireObjectCoercible(this value).
2. Let S be ? ToString(O).
3. Return CreateStringIterator(S).

抬头 CreateStringIterator最终带你到 21.1.5.2.1 %StringIteratorPrototype%.next ( ) ，它会:

9. Let cp be ! CodePointAt(s, position).
10. Let resultString be the String value containing cp.[[CodeUnitCount]] consecutive code units from s beginning with the code unit at index position.
11. Set O.[[StringNextIndex]] to position + cp.[[CodeUnitCount]].
12. Return CreateIterResultObject(resultString, false).

CodeUnitCount是你感兴趣的。这个号码来自 CodePointAt :

3. Let first be the code unit at index position within string.
4. Let cp be the code point whose numeric value is that of first.

5. If first is not a leading surrogate or trailing surrogate, then

   a. Return the Record { [[CodePoint]]: cp, [[CodeUnitCount]]: 1, [[IsUnpairedSurrogate]]: false }.

6. If first is a trailing surrogate or position + 1 = size, then

   a.Return the Record { [[CodePoint]]: cp, [[CodeUnitCount]]: 1, [[IsUnpairedSurrogate]]: true }.

7. Let second be the code unit at index position + 1 within string.

8. If second is not a trailing surrogate, then

   a. Return the Record { [[CodePoint]]: cp, [[CodeUnitCount]]: 1, [[IsUnpairedSurrogate]]: true }.

9. Set cp to ! UTF16DecodeSurrogatePair(first, second).

10. Return the Record { [[CodePoint]]: cp, [[CodeUnitCount]]: 2, [[IsUnpairedSurrogate]]: false }.

因此，当使用 Array.from 迭代字符串时，仅当所讨论的字符是代理项对的开头时，它才返回 2 的 CodeUnitCount。 here 描述了被解释为代理对的字符:

Such operations apply special treatment to every code unit with a numeric value in the inclusive range 0xD800 to 0xDBFF (defined by the Unicode Standard as a leading surrogate, or more formally as a high-surrogate code unit) and every code unit with a numeric value in the inclusive range 0xDC00 to 0xDFFF (defined as a trailing surrogate, or more formally as a low-surrogate code unit) using the following rules..:

षि不是代理对:

console.log('षि'.charCodeAt()); // First character code: 2359, or 0x937
console.log('षि'.charCodeAt(1)); // Second character code: 2367, or 0x93F

但是 👍的字符是:

console.log('👍'.charCodeAt()); // 55357, or 0xD83D
console.log('👍'.charCodeAt(1)); // 56397, or 0xDC4D

'👍'的第一个字符代码是，以十六进制表示，D83D，在 0xD800 to 0xDBFF 的范围内的主要代理人。相比之下， 'षि' 的第一个字符代码低得多，而且不是。所以 'षि'被分开，但 '👍'没有。
षि由两个单独的字符组成: ष , Devanagari Letter Ssa , 和 ि , Devanagari Vowel Sign I .当按此顺序彼此相邻时，尽管它们由两个单独的字符组成，但它们在视觉上会以图形方式组合成一个字符。

相比之下， 👍 的字符代码仅当作为单个字形组合在一起时才有意义。如果您尝试使用带有任一代码点的字符串而没有另一个代码点，您将得到一个无意义的符号:

console.log('👍'[0]);
console.log('👍'[1]);