참고글 : https://blog.jonnew.com/posts/poo-dot-length-equals-two
“🖤”.length() => 2
“❤️”.length() => 2
“👦”.length() => 2
“👦🏾”.length() => 4
“🚵♀️”.length() => 5
“👨👩👦👦”.length() => 11
한글자로 취급될 것 같은 한개의 이모지에서 이런 결과가 나오는 이유를 찾아보았습니다.
멀티바이트 문자라서 length() 값이 2이상 이라는 건 대충 알고 계실텐데,
4? 5? 11? 여기서 이상함을 느낄실 겁니다.
유니코드에서 이모지를 표현하기 위해 여러가지 방식을 사용하는데 그중 제가 확인한 4가지를 설명합니다.
- 단순 2bytes 문자
- Variation Selector-16 조합 (VS16으로 부름)
- Emoji Modifier Fitzpatrick Type1-2 ~ 6 조합
- Zero Width Joiner 조합 (ZWJ로 부름)
고유한 2bytes 유니코드 코드포인트를 가진 이모지입니다. 😀⭐️👻
VS16은 코드포인트 U+FE0F 로 지정된 안보이는 문자입니다.
이모지가 없던 시절부터 사용하던 특수기호를 이모지로 변환시켜줍니다.
"↩️ LEFTWARDS ARROW WITH HOOK"
↩ (U+21A9) + VS16 (U+FE0F) = ↩️
"❤️ RED HEART"
❤ (U+2764) + VS16 (U+FE0F) = ❤️
이렇게 해서 ↩️, ❤️ 이모지는 2bytes 가 됩니다.
참고로, ❤️ 제외한 🖤💛💜💚💙 다른색은 고유한 코드포인트로 지정되어 있습니다.
유니코드 8.0에서 인간 피부색을 표현하는 코드포인트가 추가되었습니다.
이것이 Emoji Modifier Fitzpatrick Type 이고, 최초 노란색 피부와 조합해 5가지를 더 표현 할 수 있게 되었습니다.
🏻 Light Skin Tone
🏼 Medium-Light Skin Tone
🏽 Medium Skin Tone
🏾 Medium-Dark Skin Tone
🏿 Dark Skin Tone
"👦🏾 Boy, Medium-Dark Skin Tone"
👦 (U+D83D U+DC66) + 🏿 (U+D83C U+DFFF) = 👦🏾
이렇게 해서 👦 2bytes + 🏿 2bytes = 4bytes 가 됩니다.
문자와 문자와 결합시켜 결합된 문자로 대체 시킬때 사용합니다.
코드포인트 U+200D 로 지정된 안보이는 문자입니다.
https://ko.wikipedia.org/wiki/%ED%8F%AD_%EC%97%86%EB%8A%94_%EC%A0%91%ED%95%A9%EC%9E%90
새로 만들어진 것은 아니고 인도/태국어등의 문자를 표현하기 오래전부터 사용되어 왔고 이를 이모지에 적용했습니다.
이모지 사이사이에 ZWJ를 넣어 다른 이모지로 대체합니다.
"👨👩👦👦 Family: Man, Woman, Girl, Boy"
👨 (U+D83D U+DC68) + ZWJ (U+200D) +
👩 (U+D83D U+DC69) + ZWJ (U+200D) +
👧 (U+D83D U+DC67) + ZWJ (U+200D) +
👦 (U+D83D U+DC66)
= 👨👩👦👦
이렇게 해서
👨2bytes + ZWJ 1byte +
👩2bytes + ZWJ 1byte +
👧2bytes + ZWJ 1byte +
👦2bytes
= 11bytes 가 됩니다.
"🚵♀️ Woman Mountain Biking"
🚵 (U+D83D U+DEB5) + ZWJ (U+200D) + ♀ (U+2640) + VS16 (U+FE0F) = 🚵♀️
이렇게 해서 🚵 2bytes + ZWJ 1byte + ♀ 1byte + VS16 1byte = 5bytes 가 됩니다.
예시중 가장 복잡한 이모지 입니다. ♀기호와 ZWJ, VS16 모두 조합하여 표현합니다.
어떤 텍스트 에디터에서 이모지 뒤에 커서 놓고 백스페이스를 누르면 이모지 모양이 변하면서 커서가 제자리에 머무는 현상을 겪으셨을 겁니다. 2./3./4.번이 삭제되면서 발생하는 현상입니다.
에디터마다 👨👩👦👦👩❤️💋👩 이모지처럼 여러개가 결합된 이모지를 지원하는 정도 차이가 있습니다.
어떤 에디터는 입력하면 👩❤️💋👩 이런식으로 해체되거나,
또 다른 에디터는 👩❤️💋👩 이렇게 잘보이는데 백스페이스를 누르면 👩❤️💋 이렇게 해체됩니다.