ΒΏCΓ³mo puedo dividir una cadena que contiene emoji en una matriz?

Resuelto forresto asked hace 10 aΓ±os β€’ 7 respuestas

Quiero tomar una serie de emoji y hacer algo con los personajes individuales.

En JavaScript, "πŸ˜΄πŸ˜„πŸ˜ƒβ›”πŸŽ πŸš“πŸš‡".length == 13debido a que "β›”"la longitud es 1, el resto son 2. Entonces no podemos hacer

var string = "πŸ˜΄πŸ˜„πŸ˜ƒβ›”πŸŽ πŸš“πŸš‡";
s = string.split(""); 
console.log(s);
Expandir fragmento

forresto avatar Jul 02 '14 19:07 forresto
Aceptado

Β‘JavaScript ES6 tiene una soluciΓ³n!, para una divisiΓ³n real :

[..."πŸ˜΄πŸ˜„πŸ˜ƒβ›”πŸŽ πŸš“πŸš‡"] // ["😴", "πŸ˜„", "πŸ˜ƒ", "β›”", "🎠", "πŸš“", "πŸš‡"]

ΒΏHurra? Excepto por el hecho de que cuando ejecuta esto a travΓ©s de su transpilador, es posible que no funcione (consulte el comentario de @brainkim). Solo funciona cuando se ejecuta de forma nativa en un navegador compatible con ES6. Afortunadamente, esto abarca la mayorΓ­a de los navegadores (Safari, Chrome, FF), pero si buscas una alta compatibilidad con los navegadores, esta no es la soluciΓ³n para ti.

Downgoat avatar May 31 '2016 02:05 Downgoat

Editar: consulte la respuesta de Orlin Georgiev para obtener una soluciΓ³n adecuada en una biblioteca: https://github.com/orling/grapheme-splitter

Gracias a esta respuesta hice una funciΓ³n que toma una cadena y devuelve una matriz de emoji:

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;
};

Entonces

emojiStringToArray("πŸ˜΄πŸ˜„πŸ˜ƒβ›”πŸŽ πŸš“πŸš‡")
// => Array [ "😴", "πŸ˜„", "πŸ˜ƒ", "β›”", "🎠", "πŸš“", "πŸš‡" ]
forresto avatar Jul 02 '2014 12:07 forresto

Con la prΓ³xima Intl.Segmenter. Puedes hacerlo:

const splitEmoji = (string) => [...new Intl.Segmenter().segment(string)].map(x => x.segment)

splitEmoji("πŸ˜΄πŸ˜„πŸ˜ƒβ›”πŸŽ πŸš“πŸš‡") // ['😴', 'πŸ˜„', 'πŸ˜ƒ', 'β›”', '🎠', 'πŸš“', 'πŸš‡']

Esto tambiΓ©n resuelve el problema con "πŸ‘¨β€πŸ‘¨β€πŸ‘§β€πŸ‘§" y "πŸ‘¦πŸΎ".

splitEmoji("πŸ‘¨β€πŸ‘¨β€πŸ‘§β€πŸ‘§πŸ‘¦πŸΎ") // ['πŸ‘¨β€πŸ‘¨β€πŸ‘§β€πŸ‘§', 'πŸ‘¦πŸΎ']

SegΓΊn CanIUse , aparte de IE y Firefox, esto es compatible con el 91,23% de los usuarios a nivel mundial, al momento de escribir este artΓ­culo.

Hasta que Firefox obtenga soporte, como se menciona en la respuesta de Matt Davies , Graphemer es la mejor soluciΓ³n:

let Graphemer = await import("https://cdn.jsdelivr.net/npm/[email protected]/+esm").then(m => m.default.default);
let splitter = new Graphemer();
let graphemes = splitter.splitGraphemes("πŸ‘¨β€πŸ‘¨β€πŸ‘§β€πŸ‘§πŸ‘¦πŸΎ"); // ['πŸ‘¨β€πŸ‘¨β€πŸ‘§β€πŸ‘§', 'πŸ‘¦πŸΎ']
rootEnginear avatar Mar 25 '2022 15:03 rootEnginear