Le jeu de caractères de JavaScript:
Les programmes JavaScript sont écrits à l'aide de jeux de caractères Unicode. Unicode est un superset de ASCII et Latin-1 et prend en charge presque toutes les langues sur Terre. ECMascript3 nécessite JavaScript pour prendre en charge Unicode 2.1 et les versions ultérieures, tandis que ECMascript5 nécessite la prise en charge de Unicode 3 et des versions ultérieures. Alors, nous l'avons écrit
Les programmes JavaScript sont tous codés à l'aide de Unicode.
UTF-8
UTF-8 (UTF8 bits Unicode Transformation Format) est un codage de caractères de longueur variable pour Unicode et est également un code préfixe.
Il peut être utilisé pour représenter n'importe quel caractère dans la norme Unicode, et le premier octet de son codage est toujours compatible avec ASCII, ce qui permet à un logiciel qui gère à l'origine les caractères ASCII pour continuer à utiliser sans ou nécessiter une petite quantité de modification. Par conséquent, il est progressivement devenu le codage préféré dans les e-mails, les pages Web et autres applications pour stocker ou envoyer des SMS.
La plupart des sites Web utilisent actuellement le codage UTF-8.
Convertir la chaîne codée Unicode générée par JavaScript en UTF-8 String
Comme mentionné dans le titre, le scénario d'application est très courant. Par exemple, lors de l'envoi d'un binaire au serveur, le serveur stipule que l'encodage du contenu binaire doit être UTF-8. Dans ce cas, nous devons convertir la chaîne Unicode de JavaScript en une chaîne codée UTF-8 via le programme.
Méthode de conversion
Avant la conversion, nous devons comprendre que la structure de codage d'Unicode est fixe.
Si vous ne le croyez pas, vous pouvez essayer la méthode Charcodeat de String pour voir combien octets le charcode retourné prend.
• L'anglais occupe 1 caractère et les caractères chinois occupent 2 caractères
Cependant, la longueur de la structure de codage de l'UTF-8 est déterminée par la taille d'un seul caractère.
Vous trouverez ci-dessous la taille d'un seul caractère qui occupe plusieurs octets. La longueur maximale après un seul caractère Unicode est de 6 octets.
• 1 octet: le code Unicode est 0 - 127
• 2 octets: le code Unicode est 128 - 2047
• 3 octets: le code Unicode est 2048 - 0xffff
• 4 octets: le code Unicode est 65536 - 0x1fffff
• 5 octets: le code Unicode est 0x200000 - 0x3ffffff
• 6 octets: le code Unicode est 0x4000000 - 0x7fffffff
Pour plus de détails, veuillez consulter l'image:
Parce que les codes Unicode des caractères anglais et anglais sont de 0 à 127, la longueur et les octets de l'anglais dans Unicode et UTF-8 sont les mêmes, et n'occupent que 1 octet. C'est pourquoi UTF8 est un superset d'Unicode!
Discutons maintenant des caractères chinois, car l'intervalle de code Unicode des caractères chinois est 0x2e80 - 0x9fff, donc la longueur des caractères chinois dans UTF8 est jusqu'à 3 octets.
Alors, comment les caractères chinois se convertissent-ils de 2 octets d'Unicode à trois octets d'UTF8?
Supposons que je dois convertir le caractère chinois "中" en codage UTF-8
1. Obtenez la taille de la valeur Unicode des caractères chinois
var str = 'in'; var charcode = str.charcodeat (0); console.log (charcode); // => 20013
2. Juger la durée de l'UTF8 en fonction de la taille
À partir de l'étape précédente, nous obtenons le charcode du caractère chinois "dans" est 20013. Ensuite, nous constatons que 20013 est situé dans l'intervalle 2048 - 0xffff, donc le caractère chinois "dans" devrait occuper 3 octets dans UTF8.
3. Complément
Puisque nous savons que le caractère chinois "me" doit occuper 3 octets, comment pouvons-nous obtenir ces 3 octets?
Cela nécessite la conception du code de complément. La logique de code de complément spécifique est la suivante:
OK, je sais que vous ne pouvez pas comprendre cette image, donc je vais juste en parler!
Le code de remplissage spécifique est le suivant, "x" indique l'espace vide, utilisé pour le remplissage.
• 0xxxxxxx
• 110xxxxx 10xxxxxx
• 1110xxxx 10xxxxxx 10xxxxxx
• 11110xxx 10xxxxxx 10xxxxxx 10xxxxxx
• 111110xx 10xxxxxx 10xxxxxx 10xxxxxx 10xxxxxx 10xxxxxx
• 1111110x 10xxxxxx 10xxxxx 10xxxxxx 10xxxxxx 10xxxxxx 10xxxxx
AVERTISSEMENT: l'avez-vous trouvé? Le premier octet du code de remplissage indique le nombre d'octets que le code UTF-8 entier occupe! Cette fonctionnalité est utilisée par UTF-8 décodé à Unicode ~
Donnons d'abord un exemple simple. Convertissez la lettre anglaise "A" en codage UTF8.
1. Le charcode de "A" est 65
2. 65 est dans l'intervalle entre 0-127, donc "A" occupe un octet
3. Le complément d'un octet dans UTF8 est 0xxxxxxx. X représente une position vacante et est utilisé pour le complément.
4. Convertir 65 en binaire pour obtenir 1000001
5. Ajouter 1000001 aux postes vacants de 1xxxxxx dans l'ordre d'avant en arrière, et obtenez 01000001
6. Convertir 11000001 en une chaîne pour obtenir "A"
7. Enfin, "A" est codé par UTF8.
Avec ce petit exemple, avons-nous vérifié à nouveau que l'UTF-8 est un superset d'Unicode!
D'accord, revenons au personnage chinois "Middle". Avant, nous avons le charcode de "Middle" comme 20013 et le binaire est 010011100 00101101. Les détails sont les suivants:
var code = 20013; code.tostring (2); // => 10011100101 équivaut à 01001110 00101101
Ensuite, nous suivons la méthode de "A" remplissant ce qui précède pour remplir la position.
Complément 01001110 00101101 Dans la commande de l'avant en arrière à 1110xxxxx 10xxxxxx 10xxxxxx. Obtenez 11100100 10111000 10101101.
4. Obtenez du contenu encodé UTF8
Grâce aux étapes ci-dessus, nous obtenons trois octets UTF8 de "in", 11100100 10111000 1010110101.
Nous convertissons chaque octet en hexadécimal et obtenons 0xe4 0xb8 0xad;
Ensuite, ce 0xe4 0xb8 0xad est le codage UTF8 que nous avons finalement obtenu.
Nous utilisons le tampon NodeJS pour vérifier s'il est correct.
var tampon = nouveau tampon ('in'); Console.log (Buffer.Length); // => 3Console.log (tampon); // => <Buffer E4 B8 AD> // Obtenez enfin trois octets 0xe4 0xb8 0xadParce que l'hexadécimal est sans cas, est-ce exactement le même que nous avons calculé que 0xe4 0xb8 0xad?
Écrivez la logique de codage ci-dessus dans une fonction.
// Formatez la chaîne en bytes codés UTF8 var writeUtf = fonction (str, isGetBytes) {var back = []; var byTesize = 0; pour (var i = 0; i <str.length; i ++) {var code = str.charcodeat (i); if (0x00 <= code && code <= 0x7f) {bytesize + = 1; back.push (code); } else if (0x80 <= code && code <= 0x7ff) {bytesize + = 2; back.push ((192 | (31 & (code >> 6))))); back.push ((128 | (63 & code)))} else if ((0x800 <= code && code <= 0xd7ff) || (0xe000 <= code && code <= 0xffff)) {bytesize + = 3; back.push ((224 | (15 & (code >> 12)))); back.push ((128 | (63 & (code >> 6)))); back.push ((128 | (63 & code)))}} pour (i = 0; i <back.length; i ++) {back [i] & = 0xff; } if (isGetBytes) {return back} if (byTesize <= 0xff) {return [0, byTesize] .Concat (back); } else {return [byTesize >> 8, bytesize & 0xff] .Concat (back); }} writeUtf ('in-on'); // => [0, 3, 228, 184, 173] // Les deux premiers chiffres représentent la longueur des octets UTF8 suivants. Parce que la longueur est de 3, les deux premiers octets sont `0, 3` // Le contenu est` 228, 184, 173` et converti en hexadécimal est `0xe4 0xb8 0xad` // Read UTF8-Coded Bytes et est spécialement conçu pour la chaîne var de Unicode ReadUtf = fonction (arr) {if (typeof arr === 'String') {return arr; } var utf = '', _arr = this.init (arr); for (var i = 0; i <_arr.length; i ++) {var one = _arr [i] .toString (2), v = one.match (/ ^ 1 +? (? = 0) /); if (v && one.length == 8) {var bytesLength = v [0] .length; var store = _arr [i] .toString (2) .slice (7 - bytesLength); for (var st = 1; st <bytesLength; st ++) {store + = _arr [st + i] .toString (2) .slice (2)} utf + = string.fromCharcode (parseInt (Store, 2)); i + = bytesLength - 1} else {utf + = string.fromCharcode (_arr [i])}} return utf} readUtf ([0, 3, 228, 184, 173]); => 'In'Une autre méthode pour analyser le chinois pour obtenir des bytecodes UTF8
Une autre méthode relativement simple pour convertir le chinois en bytecode UTF8 est relativement simple. Le navigateur fournit également une méthode et tout le monde utilise cette méthode. Qu'est-ce que c'est? C'est encodéuri. Bien sûr, EncodeuriComponent est également OK.
C'est vrai, c'est la méthode. Alors, comment cette méthode convertit-elle un chinois codé par Unicode en décode utf8?
var str = ''; var code = encodéuri (str); console.log (code); // =>% E4% B8% AD
Avez-vous trouvé que j'avais une chaîne échappée et que le contenu de cette chaîne est le même que le bytecode que j'ai obtenu au-dessus avant.
Ensuite, nous convertissons% E4% B8% AD en un tableau numérique.
var codeList = code.split ('%'); codeList = CodeList.map (item => parseInt (item, 16)); console.log (codeList); // => [228, 184, 173]Si simple, y a-t-il un ~~~
Quel est le principe de cette méthode simple?
Voici le problème du codage de la question en uris. Étant donné que, selon les réglementations, la querystring dans URI doit être transmise en fonction du codage UTF8, et JavaScript est Unicode, donc le navigateur nous fournit une méthode, c'est-à-dire la méthode d'encodéuri / enco -composant. Cette méthode sera expliquée
Les caractères non anglais (ceci est considéré, pourquoi les caractères non anglais sont-ils d'abord convertis en bytecode UTF8, puis ont ajouté% devant pour les épisser, nous avons donc échappé au caractère chinois "中" et avons obtenu "% e4% b8% ad".
Eh bien, ce sont tous les principes, rien d'autre.
Cependant, cette méthode a un autre inconvénient, c'est-à-dire qu'elle ne fera qu'échapper aux caractères non anglophones, donc lorsque nous devons formater les caractères anglais en codage UTF8, cette méthode ne peut pas répondre à nos besoins, et nous devons également échapper aux caractères anglais.
Alors, que dois-je faire quand je veux l'analyser? Utilisez simplement dudecoriri / decodeuriComponent.
var codeList = [228, 184, 173]; var code = codelist.map (item => '%' + item.toString (16)). join (''); decodeuri (code); // =>D'accord, cet article présentera un codage UTF8.
J'espère que cela peut vous aider à comprendre les principes de l'encodage UTF-8.
Ce qui précède est toutes les méthodes d'implémentation pour le codage UTF-8 via JavaScript qui vous a été apportée. J'espère que tout le monde soutiendra Wulin.com plus ~