我正在尝试从 the GitHub API 加载表情符号并将代码点转换为 JavaScript 中的字符串。这适用于由单个代码点组成的表情符号,但对于由多个点组成的表情符号失败,例如 family_woman_woman_girl_girl 。我正在使用 zero width joiner (zwj) 连接字符。

const list = document.getElementById('emojis');
const zwj = '\u200D';

async function renderList() {
  // load the github emojis: https://developer.github.com/v3/emojis/
  const response = await fetch('https://api.github.com/emojis');
  const data = await response.json();

  // render a list item for each emoji
  for (const [key, value] of Object.entries(data)) {
    // skip GitHub's custom emoji
    if (!/\/unicode\//.test(value)) {
      continue;
    }

    // parse the url into an array of code points
    const codePoints = value
      .substr(57)
      .replace(/\.png\?.*$/, '')
      .split('-')
      .map(hex => parseInt(hex, 16));

    // translate the code points to a string. SOMETHING WRONG HERE
    const emoji = codePoints
      .map(p => String.fromCodePoint(p))
      .join(zwj);

    // render the list item
    const li = document.createElement('li');
    li.textContent = `${key}: ${codePoints} ${emoji}`;
    list.appendChild(li);
  }
}

renderList();
<ul id="emojis"></ul>

最佳答案

并非所有表情符号序列都与 ZWJ 粘合在一起。最值得注意的是,人们和他们的肤色简单地结合在一起,没有任何填充物。

Unicode 维护 a list of all code points/combinations 它认为是表情符号。 emoji-data.txt 文件都是单cp emoji。 emoji-zwj-sequences.txt 是具有至少一个 ZWJ 和 emoji-sequences.txt 其余的序列。

请注意,并非 emoji-zwj-sequences.txt 中的所有 cps 也与 ZWJ 粘合在一起,例如,这一行:

1F469 1F3FD 200D 1F4BB                      ; Emoji_ZWJ_Sequence  ; woman technologist: medium skin tone                           #  8.0  [1] (👩🏽‍💻)
artist 部分添加了一个 ZWJ。女性和肤色部分加入,没有任何其他cp。

有一些启发式方法可以找出您是否需要 ZWJ。如果您查看 emoji-data.txt 的末尾,您会看到肤色修饰符具有 Emoji_Modifier 属性。如果它具有 Emoji_Modifier_Base 属性,则这些被定义为简单地改变先前表情符号的外观。

此外,下一个块 Emoji_Components 可以在没有 ZWJ 的情况下以一种或另一种方式组合。

关于javascript - 在 JavaScript 中将表情符号代码点转换为字符串,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/49503942/

10-10 22:35