Reading the following tutorial regarding a VueJS component that displays the character count for a textarea got me thinking.
What does that mean you say ? Well it’s rather straightforward, if you’re trying to get the length property of a string that contains UTF-8 3/4 byte (that translate into UTF-16 surrogate pair characters) your length will return 2 for each of the characters.
This might not be an issue usually, but it’s a big issue if you’re having a password policy of 8 characters that can be filled by just 4 “😹🐶😹🐶” (ok, not the best example, but everybody likes cats and dogs)
let lengthTest = "😹🐶😹🐶"; console.log(lengthTest.length); // will display 8
let lengthTest = "😹🐶😹🐶"; console.log([...lengthTest].length); // will display 4
I’m interested in knowing if you got any weird/interesting experiences with UTF-8
PS: Use this link for a nice simple-ish explanation of Unicode encodings