Jak zjistit Emojis v řetězcích JavaScriptu

Při práci s obsahem vytvářeným uživateli je velká šance, že se budete muset vypořádat s řetězci plnými emotikonů. Vykreslování emodži může být spojeno s problémy, takže možná budete chtít zjistit, kdy řetězce obsahují emodži, a nahradit je obrázky.

Pojďme zjistit, jak všechny tyto roztomilé symboly rozpoznat!

Při použití popsaných escape vlastností Unicode existují případy okrajů Emoji. Přečtěte si článek až do konce!

Jak detekovat emodži pomocí regulárních výrazů JavaScriptu?

Naštěstí regulární výrazy JavaScriptu dnes přicházejí s režimem Unicode.

MDN popisuje, že režim Unicode považuje vzor regulárního výrazu za sekvenci bodů kódu Unicode namísto jednotek kódu.

Je toho ale víc. Když povolíte režim Unicode v regulárním výrazu, můžete také použít escape vlastnosti Unicode. Escape vlastnosti Unicode (\p{} nebo \P{} ) vám umožní porovnat znaky Unicode na základě jejich vlastností a charakteristik.

To je správně; můžete přiřadit symboly měn, jiné než latinské znaky a, uhodli jste, Emojis!

Zde je příklad úryvku:

const emojiRegex = /\p{Emoji}/u;
emojiRegex.test('⭐'); // true

// The capital 'p' negates the match
const noEmojiRegex = /\P{Emoji}/u;
noEmojiRegex.test('⭐'); // false

Pokud chcete nahradit a upravit emotikony v řetězcích JavaScriptu, můžete to udělat pomocí String.replaceAll .

// Note the 'g' flag to replace allEmojis
'🙈–👍–⭐'.replaceAll(/\p{Emoji}/ug, '_'); // '_–_–_'

Podpora prohlížeče pro úniky vlastností Unicode vypadá také docela dobře! 🎉

MDN Compat Data (zdroj)
Informace o podpoře prohlížeče pro escape vlastnosti Unicode (\p{...} )
64 64 79 78 78 11.1 11.1 9.0 64

Pokud máte připomínky k detekci Emojis v JavaScriptu, dejte mi prosím vědět na Twitteru nebo mi napište starý dobrý e-mail. Rád bych se o tom dozvěděl více!

Mathias Bynes poukázal na to, že tento přístup detekce Emoji má nedostatky. Escape vlastnosti, například \p{Emoji} odpovídá každému jednotlivému bodu kódu Emoji a to může být problém.

Podívejme se na příklad:

"👨‍👩‍👧‍👦".replaceAll(/\p{Emoji}/gu, '-'); // '----'

Různé emotikony, jako je „rodina“, jsou vykresleny jako jeden symbol, ale sestávají z více než jednoho kódu. Unicode vlastnosti escape odpovídají každému z nich, takže můžete narazit na neočekávané chování.

Pokud vás zajímá, co by se dalo považovat za Emoji, podívejte se na tento rozsáhlý seznam.

Existuje důvod, proč Mathias' emoji-regex balíček má 49 milionů stažení týdně, takže se na něj nezapomeňte podívat!