JS - 문자열, 유니코드 변환하기 (유니코드 인코딩/디코딩, String to Unicode, Unicode to String)

문자열을 유니코드로 변환하기

문자열을 유니코드로 변환하려면 charCodeAt() 메서드를 사용하여야 한다.

 

[ 구문 ]

charCodeAt(index)

 

charCodeAt() 메서드 설명

문자열의 지정된 인덱스에서 UTF-16 코드를 나타내는 정수를 String 타입으로 반환한다.

주어진 인덱스에서 유니코드 포인트를 얻으려면 괄호 사이에 인덱스를 넣으면 된다.

가능한 값의 범위는 0부터 65535까지이며, 인덱스가 범위를 벗어나면 NaN 값을 반환한다.

문자열의 인덱스란, 문자열에서 나타내는 글자수로 생각하면 이해하기 쉽다.

예를 들어, '은별' 이라는 문자열이면..

• '은'의 문자 인덱스는 0이고
• '별'의 문자 인덱스는 1이다.

 

유니코드 포인트 변환 예시

// 문자열을 유니코드로 출력
let str = "Hello, 은별!";
console.log(`기존의 문자열 : ${str}`);

// 각 문자의 UTF-16 코드 값 반환한 값을 배열로 저장
let unicodeArray = str.split('').map(function(char) {
    return char.charCodeAt(0);
});

// 유니코드 문자 배열을 문자열로 변경
let unicodeStr = unicodeArray.join(' ');

// 문자열을 유니코드 코드 포인트로 변환한 결과 출력
console.log(`변환된 유니코드 : ${unicodeStr}`);

 

• 콘솔 결과 화면
  • 변환된 유니코드는 10진수의 정수의 값으로 반환된다.

기존의 문자열 : Hello, 은별!
변환된 유니코드 : 72 101 108 108 111 44 32 51008 48324 33

 

유니코드 16진수 변환 예시

charCodeAt 메서드를 사용하는 것은 같다.

하지만 추가 과정이 더 필요하다.

1. 16진수로 표현하기 위해서 toString() 메서드를 이용한다.
   • 괄호안에는 표현할 진수를 넣는다. (16)
2. 16진수의 형식(0xFFFF)을 갖도록 padStart() 메서드를 이용한다.
   • chatCodeAt은 최대 65535(FFFF)의 범위까지 가능하므로 4자리의 형식을 갖춰야한다. (4, "0")
   • 첫 인자의 4는 4자리라는 것을 의미하고, 다른 인자는 4자리의 길이를 만족하도록 빈 자릿수에는 0을 넣는다는 것을 의미한다.

출력될 결과를 두 가지의 형태로 문자열을 가공하여 출력하였다.

// 유니코드 16진수 및 유니코드 이스케이프 시퀀스로 변환
let str2 = "Hello, 은별!";
console.log(`기존의 문자열 : ${str2}`);

let unicode16Str = "";
let escapeSeqStr = "";
for (let i=0; i<str2.length; i++) {
    unicode16Str += "0x" + str.charCodeAt(i).toString(16).padStart(4, "0");
    escapeSeqStr += "\\u" + str.charCodeAt(i).toString(16).padStart(4, "0");
}
console.log(`변환된 16진수 유니코드 : ${unicodeStr}`);
console.log(`유니코드 이스케이프 시퀀스 : ${escapeSeqStr}`);

 

• 콘솔 결과 화면

기존의 문자열 : Hello, 은별!
변환된 16진수 유니코드 : 0x00480x00650x006c0x006c0x006f0x002c0x00200xc7400xbcc40x0021
유니코드 이스케이프 시퀀스 : \u0048\u0065\u006c\u006c\u006f\u002c\u0020\uc740\ubcc4\u0021

---

유니코드를 문자열로 변환하기

유니코드를 문자열로 변환하려면 fromCharCode() 메서드를 사용하여야 한다.

 

[ 구문 ]

String.fromCharCode(num1[, ...[, numN]])

 

fromCharCode() 메서드 설명

UTF-16 코드 유닛의 시퀀스로부터 문자열을 생성해 반환한다.

가능한 값의 범위는 0부터 65535(0xFFFF)까지이며, 초과하는 값은 잘린다.

예를 들어 51008, 48324의 값을 갖는 두 개의 유니코드라면...

• 51008 : 은
• 48324 : 별

로 변환된다. 유니코드는 위와 같이 10진수의 정수를 넣어도 되고, 16진수의 값을 넣어도 된다.

 

문자열 변환 예시

// 유니코드 값을 문자열로 출력
let unicodeStr = "72 101 108 108 111 44 32 51008 48324 33";
console.log(`유니코드 값 : ${unicodeStr}`);

var strArray = unicodeStr.split(' ').map(function(char) {
    return String.fromCharCode(char);
});
var strString = strArray.join('');
console.log(`변환된 문자열 : ${strString}`);

 

• 콘솔 결과 화면
  • 입력한 유니코드 값은 10진수의 유니코드 포인트이다.

유니코드 값 : 72 101 108 108 111 44 32 51008 48324 33
변환된 문자열 : Hello, 은별!

 

16진수 유니코드 문자열 변환 예시

유니코드의 값 앞에는 명시적으로 '0x'를 붙이지만 생략해도 된다.

let unicodeStr2 = "0048 0065 006c 006c 006f 002c 0020 c740 bcc4 0021";
console.log(`16진수 유니코드 값 : ${unicodeStr2}`);

var strArray2 = unicodeStr.split(' ').map(function(char) {
    return String.fromCharCode(char);
});
var strString2 = strArray2.join('');
console.log(`변환된 문자열 : ${strString2}`);

 

• 콘솔 결과 화면

16진수 유니코드 값 : 0048 0065 006c 006c 006f 002c 0020 c740 bcc4 0021
변환된 문자열 : Hello, 은별!

---

참고

모질라 - 참고자료 - String.prototype.charCodeAt()

모질라 - 참고자료 - String.fromCharCode()

모질라 - 참고자료 - Object.prototype.toString()

모질라 - 참고자료 - String.prototype.padStart()