Az UTF-8 a „ Unicode transzformációs formátum 8 bites ” és egy nagyszerű kódolási formátumnak felel meg, amely biztosítja, hogy a karakterek megfelelően jelenjenek meg minden eszközön, függetlenül a használt nyelvtől/szkripttől. Ezenkívül ez a formátum segíti a weboldalakat, és szöveges adatok tárolására, feldolgozására és továbbítására szolgál az interneten.
Ez az oktatóanyag az alábbi tartalmi területeket fedi le:
- Mi az UTF-8 kódolás?
- Hogyan működik az UTF-8 kódolás?
- Hogyan történik a kódpontértékek kiszámítása?
- Hogyan lehet kódolni/dekódolni az UTF-8-at JavaScriptben?
- Az UTF-8 kódolása/dekódolása JavaScriptben az „encodeURIComponent()” és a „decodeURIComponent()” metódusokkal.
- UTF-8 kódolása/dekódolása JavaScriptben az „encodeURI()” és „decodeURI()” metódusok használatával.
- UTF-8 kódolása/dekódolása JavaScriptben a reguláris kifejezések használatával.
- Következtetés
Mi az UTF-8 kódolás?
' UTF-8 kódolás ” a Unicode karakterek sorozatának 8 bites bájtokat tartalmazó kódolt sztringgé alakításának eljárása. Ez a kódolás a karakterek széles skáláját képviselheti a többi karakterkódoláshoz képest.
Hogyan működik az UTF-8 kódolás?
Az UTF-8-ban szereplő karakterek megjelenítése során minden egyedi kódpont egy vagy több bájttal van ábrázolva. A következő az ASCII tartomány kódpontjainak lebontása:
- Egy bájt az ASCII tartomány kódpontjait jelöli (0-127).
- Két bájt képviseli az ASCII tartomány kódpontjait (128-2047).
- Három bájt képviseli az ASCII tartomány kódpontjait (2048-65535).
- Négy bájt képviseli az ASCII tartomány kódpontjait (65536-1114111).
Ez olyan, hogy az első bájt egy „ UTF-8 A sorozat a következő: vezető bájt ', amely információt ad a sorozatban lévő bájtok számáról és a karakter kódpontértékéről.
Az egy-, két-, három- és négybájtos sorozat „vezető bájtja” a (0-127), (194-233), (224-239) és (240-247) tartományba esik.
A sorban lévő többi bájt a ' utólag ” bájt. A két-, három- és négybájtos sorozat bájtjai mind a 128-191 tartományban vannak. Ez olyan, hogy a karakter kódpontértéke kiszámítható a kezdő és a záró bájtok elemzésével.
Hogyan történik a kódpontértékek kiszámítása?
A különböző bájtsorozatokhoz tartozó kódpontértékek kiszámítása a következőképpen történik:
- Kétbájtos szekvencia: A kódpont egyenértékű a következővel: „((lb – 194) * 64) + (tb – 128)”.
- Három bájtos szekvencia : A kódpont megegyezik a következővel: „((lb – 224) * 4096) + ((tb1 – 128) * 64) + (tb2 – 128)”.
- Négy bájtos szekvencia : A kódpont megegyezik a következővel: „((lb – 240) * 262144) + ((tb1 – 128) * 4096) + ((tb2 – 128) * 64) + (tb3 – 128)”.
Hogyan lehet kódolni/dekódolni az UTF-8-at JavaScriptben?
Az UTF-8 kódolása és dekódolása JavaScriptben az alábbi módszerekkel hajtható végre:
- ' enodeURIComponent() ” és „ decodeURIComponent() ” Módszerek.
- ' encodeURI() ” és „ decodeURI() ” Módszerek.
- Reguláris kifejezések.
1. megközelítés: UTF-8 kódolása/dekódolása JavaScriptben az „encodeURIComponent()” és a „decodeURIComponent()” módszerekkel
A ' encodeURIComponent() ” metódus egy URI komponenst kódol. Ezenkívül speciális karaktereket is tud kódolni, például @, &, :, +, $, # stb. decodeURIComponent() ” metódus azonban dekódol egy URI komponenst. Ezek a módszerek használhatók az átadott értékek UTF-8 kódolására, illetve dekódolására.
Szintaxis ('encodeURIComponent()' módszer)
encodeURIComponent ( x )Az adott szintaxisban a „ x ” jelzi a kódolandó URI-t.
Visszatérési érték
Ez a módszer egy kódolt URI-t kapott le karakterláncként.
Szintaxis ('decodeURIComponent()' módszer)
decodeURIComponent ( x )Itt, ' x ” a dekódolandó URI-ra utal.
Visszatérési érték
Ez a módszer megadja a dekódolt URI-t.
1. példa: UTF-8 kódolása JavaScriptben
Ez a példa az átadott karakterláncot egy kódolt UTF-8 értékre kódolja egy felhasználó által definiált függvény segítségével:
Visszatérés menekülni ( encodeURIComponent ( x ) ) ;
}
legyen val = 'itt' ;
konzol. log ( 'Adott érték ->' + val ) ;
legyen kódolvaVal = encode_utf8 ( val ) ;
konzol. log ( 'Kódolt érték -> ' + encodeVal ) ;
Ezekben a kódsorokban hajtsa végre az alábbi lépéseket:
- Először határozza meg a függvényt encode_utf8() ”, amely a megadott paraméter által képviselt átadott karakterláncot kódolja.
- Ezt a kódolást a ' encodeURIComponent() ” metódus a függvénydefinícióban.
- Jegyzet: A ' unescape() ” metódus bármilyen escape szekvenciát lecserél az általa képviselt karakterre.
- Ezután inicializálja a kódolandó értéket, és jelenítse meg.
- Most hívja meg a definiált függvényt, és adja át a meghatározott karakterkombinációt argumentumaként az érték UTF-8 kódolásához.
Kimenet
Itt arra utalhatunk, hogy az egyes karakterek UTF-8-ban vannak ábrázolva és ennek megfelelően kódolva.
2. példa: UTF-8 dekódolása JavaScriptben
Az alábbi kód bemutató dekódolja az átadott értéket (karakterek formájában) egy kódolt UTF-8 reprezentációra:
Visszatérés decodeURIComponent ( menekülni ( x ) ) ;
}
legyen val = 'à çè' ;
konzol. log ( 'Adott érték ->' + val ) ;
hagyjuk dekódolni = decode_utf8 ( val ) ;
konzol. log ( 'Dekódolt érték -> ' + dekódolni ) ;
Ebben a kódblokkban:
- Hasonlóképpen határozza meg a ' függvényt decode_utf8() ', amely dekódolja az átadott karakterkombinációt a ' decodeURIComponent() ” módszerrel.
- Jegyzet: A ' menekülni() ” metódus egy új karakterláncot kér le, amelyben a különböző karaktereket hexadecimális escape szekvenciákkal helyettesítik.
- Ezután adja meg a dekódolandó karakterek kombinációját, és nyissa meg a definiált funkciót az UTF-8 dekódolás megfelelő végrehajtásához.
Kimenet
Itt arra utalhatunk, hogy az előző példában szereplő kódolt érték az alapértelmezett értékre lett dekódolva.
2. megközelítés: UTF-8 kódolása/dekódolása JavaScriptben az „encodeURI()” és „decodeURI()” metódusok használatával
A ' encodeURI() ” metódus úgy kódol egy URI-t, hogy több karakter minden egyes példányát a karakter UTF-8 kódolását reprezentáló escape szekvenciákkal helyettesíti. Összehasonlítva a „ encodeURIComponent() ” metódussal, ez a módszer korlátozott karaktereket kódol.
A ' decodeURI() ” metódus azonban dekódolja az URI-t (kódolt). Ezek a módszerek kombinálva is megvalósíthatók egy UTF-8 kódolású értékben lévő karakterkombináció kódolására és dekódolására.
Szintaxis(encodeURI() metódus)
encodeURI ( x )A fenti szintaxisban: ' x ” az URI-ként kódolandó értéknek felel meg.
Visszatérési érték
Ez a módszer a kódolt értéket karakterlánc formájában kéri le.
Szintaxis(decodeURI() módszer)
decodeURI ( x )Itt, ' x ” a dekódolandó kódolt URI-t jelöli.
Visszatérési érték
A dekódolt URI-t karakterláncként adja vissza.
1. példa: UTF-8 kódolása JavaScriptben
Ez a bemutató az átadott karakterkombinációt kódolt UTF-8 értékké kódolja:
Visszatérés menekülni ( encodeURI ( x ) ) ;
}
legyen val = 'itt' ;
konzol. log ( 'Adott érték ->' + val ) ;
legyen kódolva Val = encode_utf8 ( val ) ;
konzol. log ( 'Kódolt érték -> ' + encodeVal ) ;
Itt idézzük fel a kódoláshoz lefoglalt függvény meghatározásának módszereit. Most használja az „encodeURI()” metódust, hogy az átadott karakterkombinációt UTF-8 kódolású karakterláncként jelenítse meg. Ezután szintén definiálja a kiértékelendő karaktereket, és hívja meg a definiált függvényt úgy, hogy a definiált értéket argumentumaként adja át a kódolás végrehajtásához.
Kimenet
Itt nyilvánvaló, hogy az átadott karakterkombináció sikeresen kódolásra került.
2. példa: UTF-8 dekódolása JavaScriptben
Az alábbi kódbemutató dekódolja a kódolt UTF-8 értéket (az előző példában):
Visszatérés decodeURI ( menekülni ( x ) ) ;
}
legyen val = 'à çè' ;
konzol. log ( 'Adott érték ->' + val ) ;
hagyjuk dekódolni = decode_utf8 ( val ) ;
konzol. log ( 'Dekódolt érték -> ' + dekódolni ) ;
Ennek a kódnak megfelelően deklarálja a „függvényt decode_utf8() ', amely tartalmazza a megadott paramétert, amely a karakterek kombinációját képviseli, amelyet a ' decodeURI() ” módszerrel. Most adja meg a dekódolandó értéket, és hívja meg a definiált függvényt, hogy a dekódolást alkalmazza a ' UTF-8 ' reprezentáció.
Kimenet
Ez az eredmény azt jelenti, hogy a korábban kódolt érték ennek megfelelően kerül meghatározásra.
3. megközelítés: UTF-8 kódolása/dekódolása JavaScriptben a reguláris kifejezések használatával
Ez a megközelítés úgy alkalmazza a kódolást, hogy a többbájtos unicode karakterlánc UTF-8 több egybájtos karakterre van kódolva. Hasonlóképpen a dekódolást úgy hajtják végre, hogy a kódolt karakterlánc visszafejlődik többbájtos Unicode karakterekre.
1. példa: UTF-8 kódolása JavaScriptben
Az alábbi kód a többbájtos unicode karakterláncot UTF-8 egybájtos karakterekre kódolja:
ha ( típusú val != 'húr' ) dobás új TypeError ( 'A paraméter' val 'nem egy húr' ) ;
const string_utf8 = val. cserélje ki (
/[\u0080-\u07ff]/g , // U+0080 - U+07FF => 2 bájt 110yyyyyy, 10zzzzzz
funkció ( x ) {
volt ki = x. charCodeAt ( 0 ) ;
Visszatérés Húr . from CharCode ( 0xc0 | ki >> 6 , 0x80 | ki & 0x3f ) ; }
) . cserélje ki (
/[\u0800-\uffff]/g , // U+0800 - U+FFFF => 3 bájt 1110xxxx, 10yyyyyy, 10zzzzzz
funkció ( x ) {
volt ki = x. charCodeAt ( 0 ) ;
Visszatérés Húr . from CharCode ( 0xe0 | ki >> 12 , 0x80 | ki >> 6 & 0x3F , 0x80 | ki & 0x3f ) ; }
) ;
konzol. log ( 'Kódolt érték reguláris kifejezés használatával -> ' + string_utf8 ) ;
}
kódol UTF8 ( 'itt' )
Ebben a kódrészletben:
- Határozza meg a függvényt encodeUTF8() ', amely tartalmazza azt a paramétert, amely a kódolandó értéket reprezentálja, mint ' UTF-8 ”.
- A definíciójában ellenőrizze az átadott értéket, amely nem a karakterlánc a ' típusú ' operátort, és adja vissza a megadott egyéni kivételt a ' dobás ” kulcsszó.
- Ezt követően alkalmazza a „ charCodeAt() ” és „ fromCharCode() ” metódusokat a karakterlánc első karakterének Unicode-jának lekérésére és a megadott Unicode-érték karakterekké alakítására, ill.
- Végül hívja meg a definiált függvényt a megadott karaktersorozat átadásával, hogy ezt az értéket '' UTF-8 ' reprezentáció.
Kimenet
Ez a kimenet azt jelzi, hogy a kódolás megfelelően van végrehajtva.
2. példa: UTF-8 dekódolása JavaScriptben
Ebben a bemutatóban a karaktersorozat a következőre dekódolásra kerül: UTF-8 ' reprezentáció:
ha ( típusú val != 'húr' ) dobás új TypeError ( 'A paraméter' val 'nem egy húr' ) ;
const str = val. cserélje ki (
/[\u00e0-\u00ef][\u0080-\u00bf][\u0080-\u00bf]/g ,
funkció ( x ) {
volt ki = ( ( x. charCodeAt ( 0 ) & 0x0f ) << 12 ) | ( ( x. charCodeAt ( 1 ) & 0x3f ) << 6 ) | ( x. charCodeAt ( 2 ) & 0x3f ) ;
Visszatérés Húr . from CharCode ( ki ) ; }
) . cserélje ki (
/[\u00c0-\u00df][\u0080-\u00bf]/g ,
funkció ( x ) {
volt ki = ( x. charCodeAt ( 0 ) & 0x1f ) < '+str);
}
decodeUTF8('à çè')
Ebben a kódban:
- Hasonlóképpen határozza meg a ' függvényt dekódolni UTF8() ” amelynek paramétere a dekódolandó átadott értékre vonatkozik.
- A függvénydefinícióban ellenőrizze az átadott érték karakterlánc-feltételét a „ típusú ' operátor.
- Most alkalmazza a „ charCodeAt() ” metódussal lekérheti az első, második és harmadik karakterlánc Unicode-ját.
- Alkalmazza továbbá a „ String.fromCharCode() ” módszer a Unicode értékek karakterekké alakításához.
- Hasonlóképpen ismételje meg ezt az eljárást, hogy lekérje az első és a második karakterlánc Unicode-ját, és ezeket a Unicode értékeket karakterekké alakítsa.
- Végül nyissa meg a meghatározott függvényt az UTF-8 dekódolt érték visszaadásához.
Kimenet
Itt ellenőrizhető, hogy a dekódolás helyesen történt-e.
Következtetés
Az UTF-8 ábrázolású kódolás/dekódolás a „ enodeURIComponent()” és ' decodeURIComponent() módszerek, a „ encodeURI() ” és „ decodeURI() ” metódusokkal, vagy a reguláris kifejezések használatával.