如何将包含表情符号的字符串拆分为数组?

IT技术 javascript unicode emoji
2021-03-18 06:25:49

(您需要 Firefox 或 Safari 才能看到代码中的表情符号。)

我想拿一串表情符号并对单个字符做一些事情。

在 JavaScript 中"😴😄😃⛔🎠🚓🚇".length == 13因为"⛔"长度为 1,其余为 2。所以我们不能这样做

var string = "😴😄😃⛔🎠🚓🚇";
s = string.split(""); 
c = [];
c[0] = s[0]+s[1];
console.log(c);

6个回答

JavaScript ES6 有一个解决方案!,对于真正的拆分:

[..."😴😄😃⛔🎠🚓🚇"] // ["😴", "😄", "😃", "⛔", "🎠", "🚓", "🚇"]

耶?除了当你通过你的转译器运行它时,它可能不起作用(见@brainkim 的评论)。它仅在本机运行在符合 ES6 的浏览器上运行时才有效。幸运的是,这包括大多数浏览器(Safari、Chrome、FF),但如果您正在寻找高浏览器兼容性,这不是适合您的解决方案。

啊,我是说它有时有效。“当你通过你的转译器运行它时,它不会工作”意味着它永远不会工作。这取决于字符串中的特定表情符号、您使用的转译器等。
2021-04-23 06:25:49
@brainkim 我在答案中指定了这一点。不符合标准是编译器的错
2021-05-01 06:25:49
[...'👨‍👨‍👧‍👧'] // ["👨", "‍", "👨", "‍", "👧", "‍", "👧"]
2021-05-04 06:25:49
[..."👦🏾"] // ["👦", "🏾"]
2021-05-04 06:25:49
带有 es6 设置的 Babel 会将其转换为对 String 的迭代器函数的调用,因此它可以在某些转译器中工作。
2021-05-17 06:25:49

编辑:请参阅Orlin Georgiev对库中正确解决方案的回答https : //github.com/orling/grapheme-splitter


感谢这个答案,我创建了一个函数,它接受一个字符串并返回一个表情符号数组:

var emojiStringToArray = function (str) {
  split = str.split(/([\uD800-\uDBFF][\uDC00-\uDFFF])/);
  arr = [];
  for (var i=0; i<split.length; i++) {
    char = split[i]
    if (char !== "") {
      arr.push(char);
    }
  }
  return arr;
};

所以

emojiStringToArray("😴😄😃⛔🎠🚓🚇")
// => Array [ "😴", "😄", "😃", "⛔", "🎠", "🚓", "🚇" ]
emojiStringToArray( '👨‍👨‍👧‍👧' ) // ["👨", "‍", "👨", "‍", "👧", "‍", "👧"]
2021-04-22 06:25:49
只需使用该match方法str.match(/([\uD800-\uDBFF][\uDC00-\uDFFF])/);,它就会返回表情符号
2021-05-01 06:25:49
我试过你的函数,它对我有用,但看看这个:emojiStringToArray("😴😄😃⛔🎠🚓🚇❤️❤️❤️❤️❤️❤️") // => Array [ "😴", "😄", "😃" , "⛔", "🎠", "🚓", "🚇", "❤️❤️❤️❤️❤️❤️"] 你知道如何解决这个错误吗?
2021-05-09 06:25:49
请注意,这不适用于使用零宽度连接器、变体选择器或数字 + 键帽 + 变体选择器的键帽表情符号的表情符号
2021-05-10 06:25:49

做到这一点的 grapheme-splitter 库即使与旧浏览器也完全兼容,并且不仅适用于表情符号,还适用于各种异国情调的字符:https : //github.com/orling/grapheme-splitter 您可能会错过 edge-任何自制解决方案中的案例。这个实际上是基于 UAX-29 Unicode 标准的

拆分 UTF8 字符串的现代/正确方法是使用Array.from(str)而不是str.split('')

可悲的是,这对复合材料不起作用: Array.from('👨‍👨‍👧‍👧'); // [ "👨", "‍", "👨", "‍", "👧", "‍", "👧" ] Array.from('👦🏾'); // [ "👦", "🏾" ]
2021-05-03 06:25:49
这太棒了。通过他们,MDN 也为此提供了一个 polyfill。请参阅:developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/...
2021-05-10 06:25:49

可以使用u正则表达式标志来完成正则表达式为:

/.*?/u

每次至少有零个或多个字符可能是也可能不是表情符号,但不能是空格或换行符时,这就会被破坏。

  • 至少有零个或多个:(?分成零个字符)
  • 零个或多个: *
  • 不能是空格或换行符: .
  • 可能是也可能不是表情符号: /u

通过使用问号,?我强制精确地剪切每个零字符,否则/.*/u它会剪切所有字符,直到找到空格或换行符。

var string = "😴😄😃⛔🎠🚓🚇"
var c = string.split(/.*?/u)
console.log(c)

'👦🏾'.split(/.*?/u); // [ "👦", "🏾" ]
2021-05-13 06:25:49