DEV Community

Cover image for JS Plays With Emojis!
Muhammad MP
Muhammad MP

Posted on

JS Plays With Emojis!

Do you see the cover image? I saw that in a post, someone wondered about why it happens as if he had suddenly discovered one of Javascript's hidden features. But what is really happening there?


Let's have some fun with emojis:

const family = '๐Ÿ‘จโ€๐Ÿ‘ฉโ€๐Ÿ‘งโ€๐Ÿ‘ฆ'
console.log([...family])
// ['๐Ÿ‘จ', 'โ€', '๐Ÿ‘ฉ', 'โ€', '๐Ÿ‘ง', 'โ€', '๐Ÿ‘ฆ']
Enter fullscreen mode Exit fullscreen mode

As you see, we have seven elements in the array, not only the member families; We got some emojis glued together with the zero with joiner character.

console.log(family.includes('๐Ÿ‘ฆ'))
// do they have a son? returns true!

let familyWithTwoDoughters = family.replace('๐Ÿ‘ฆ', '๐Ÿ‘ง')
// we get this: ๐Ÿ‘จโ€๐Ÿ‘ฉโ€๐Ÿ‘งโ€๐Ÿ‘ง
Enter fullscreen mode Exit fullscreen mode

Happily this is true not only about family emojis, but also for many emojies we may never use. Here is the technologist emoji (๐Ÿ‘จโ€๐Ÿ’ป) that is made of ๐Ÿ‘จ and ๐Ÿ’ป! After googling some stuff, I explored this file on Github:
https://github.com/unicode-org/icu/blob/main/icu4c/source/data/unidata/emoji-zwj-sequences.txt
that contains a long list of them.

An Emoji ZWJ Sequence is a combination of multiple emojis which display as a single emoji on supported platforms.

The formula is to combine multiple emojis using the zero width joiner character:
๐Ÿ‘จ + ZWJ + ๐Ÿ”ฌ = ๐Ÿ‘จโ€๐Ÿ”ฌ
๐Ÿป + ZWJ + โ„ = ๐Ÿปโ€โ„๏ธ
๐Ÿˆ + ZWJ + โฌ› = ๐Ÿˆโ€โฌ›

You can play with them in Telegram or any other application that supports them. It is not as magical as some people may think and has nothing to do with JS. We can do all of this using PHP, and any programming language supports strings:

$family = '๐Ÿ‘จโ€๐Ÿ‘ฉโ€๐Ÿ‘งโ€๐Ÿ‘ฆ';
var_dump(mb_str_split($family));
Enter fullscreen mode Exit fullscreen mode

Thank you.

Top comments (4)

Collapse
 
mahdiyarghd profile image
MahdiyarGHD

Thank you for sharing this post. Keep up the great work!

Collapse
 
muhammadmp profile image
Muhammad MP

Thank you for reading my post! ๐Ÿ˜Š

Collapse
 
ahmed_aarafa profile image
Ahmed Arafa

That's Funny and insightful๐Ÿ˜„

Collapse
 
muhammadmp profile image
Muhammad MP

We can think about a translator that translates a text to emojis! ๐Ÿ˜