JavaScript - 유니코드: 초보자를 위한 종합 가이드

안녕하세요, 야심 찬 코더 여러분! 오늘 우리는 JavaScript의 유니코드 세계로 흥미로운 여정을 떠납니다. 프로그래밍에 새로운 사람이라면 걱정하지 마세요 - 저는 당신의 친절한 안내자가 되겠습니다. 단계별로 차근차근 진행하겠습니다. 그럼 커피(또는 차, 그게 당신의 취향이라면)를 한 잔 마시고, 같이 뛰어들어보겠습니다!

JavaScript - Unicode

유니코드는 무엇인가요?

상상해보세요. 중국에 사는 펜 친구에게 편지를 쓰려고 하지만, 키보드에는 영어字母만이 있습니다. 짜증나죠, right? 이때 유니코드가 구원의 손을 내밀어줍니다!

유니코드는 마법의 사전처럼 각 언어 체계의 모든 문자에 고유한 번호(코드 포인트라고 부릅니다)를 할당해줍니다. 이것은 단순히 글자와 숫자에만 해당되지 않습니다. 기호, 이모티콘, 그리고 고대의 글자까지 포함됩니다!

예를 들어, 'A' 글자는 유니코드 코드 포인트 U+0041를 가지고 있으며, 중국어 문자 '中' (의미는 "중간")은 코드 포인트 U+4E2D를 가지고 있습니다.

유니코드의 直感

유니코드를 컴퓨터의 universal language라고 생각해보세요. 유니코드 이전에는 세계의 여러 지역에서 서로 다른 인코딩 시스템을 사용해 많은 혼란과 호환성 문제가 발생했습니다. 디지털 세계에서의 바别의 탑이었습니다!

유니코드는 모든 글자 체계의 문자를 표현할 수 있는 표준화된 시스템을 만들어 이러한 문제를 해결했습니다. 모든 언어의 모든 글자에 고유한 ID 카드를 주는 것처럼, 컴퓨터 어디서나 인식할 수 있게 했습니다.

JavaScript에서의 유니코드

이제 JavaScript가 유니코드를 어떻게 처리하는지 살펴보겠습니다. JavaScript는 UTF-16 인코딩을 사용하며, 따라서 첫 65,536개의 유니코드 문자(기본 다국어 평면 또는 BMP로 알려져 있습니다)를 직접 표현할 수 있습니다.

다음은 JavaScript에서 유니코드를 다루기 위해 제공하는 메서드의 간단한 표입니다:

메서드	설명
`String.fromCharCode()`	유니코드 값으로 문자열을 생성합니다
`String.fromCodePoint()`	코드 포인트로 문자열을 생성합니다
`charCodeAt()`	문자의 유니코드 값을 반환합니다
`codePointAt()`	문자의 코드 포인트를 반환합니다

이제 몇 가지 예제를 통해 이这些东西를 실제로 보겠습니다!

예제

1. 유니코드 값으로 문자열 생성

let heart = String.fromCharCode(9829);
console.log(heart); // ♥

이 예제에서는 String.fromCharCode()를 사용하여 하트 기호를 생성하고 있습니다. 숫자 9829는 검은 하트 기호(♥)의 유니코드 값입니다. JavaScript에게 "Hey, ID 카드 번호 9829에 해당하는 문자를 주세요!"라고 말하는 것과 같습니다.

2. 문자의 유니코드 값 얻기

let str = "Hello, 世界!";
console.log(str.charCodeAt(7)); // 19990

여기서는 charCodeAt()를 사용하여 문자열의 인덱스 7에 있는 문자(인덱스는 0부터 시작하므로 '世')의 유니코드 값을 얻고 있습니다. "이 문자열의 8번째 문자의 ID 카드 번호는 무엇인가요?"라고 묻는 것과 같습니다.

3. BMP 외의 문자 처리

let emoji = "?";
console.log(emoji.codePointAt(0)); // 128640
console.log(String.fromCodePoint(128640)); // ?

BMP(기본 다국어 평면) 외의 문자(많은 이모티콘과 같은 것)를 처리하려면 codePointAt()와 String.fromCodePoint()를 사용해야 합니다. 이 예제에서는 로켓 이모티콘을 다루고 있습니다. 이모티콘은 매우 높은 ID 번호를 가진 특별한 문자입니다!

4. 문자 수 올바르게 계산하기

let text = "? Rainbow";
console.log(text.length); // 9
console.log([...text].length); // 8

이 예제는 조금 복잡합니다! JavaScript는 BMP 외의 문자를 두 개의 문자로 간주합니다. 따라서 비봉이 이모티콘(?)은 두 개의 문자로 계산됩니다. 이를 하나의 문자로 계산하려면 확장 연산자(...)를 사용하여 문자열을 문자 배열로 분할할 수 있습니다.

5. 유니코드 이스케이프 시퀀스

console.log("\u{1F600}"); // ?
console.log("\u{1F64B}\u{200D}\u{2640}\u{FE0F}"); // ?‍♀️

유니코드 이스케이프 시퀀스는 코드에 유니코드 문자를 표현하는 데 사용됩니다. 실제 문자 대신 ID 카드 번호를 쓰는 것과 같습니다. \u{...} 문법은 모든 유니코드 코드 포인트에 사용됩니다.

결론

이제 여러분은 JavaScript에서 유니코드에 대한 쐬 Windswept 여정을 마쳤습니다. 유니코드가 무엇인지 이해하고, JavaScript가 그것을 어떻게 처리하는지 보고, 몇 가지 재미있는 예제를 풀어보았습니다. 이 여정이 당신을 만족시켰기를 바랍니다.

유니코드는 전 세계 어디서나 사람들이 사용할 수 있는 소프트웨어를 작성할 수 있게 해줍니다. 기술이 우리를 하나로 만들고 장벽을 허물 수 있는 아름다운 예입니다.

당신의 코딩 여정을 계속하면서 유니코드를 더 탐구하고 실험해보세요. 다른 언어로 메시지를 써보거나, 코드에 이모티콘을 사용해보세요. 프로그래밍의 세계는 넓고 흥미롭며, 유니코드는 글로벌 소통의 여행자 여러분의 여행 패스포트입니다!

Happy coding, and until next time - may your code be bug-free and your coffee be strong! ?☕

Credits: Image by storyset