문자열과 그래픽

<문자열>
# ASCII
- 영문 알파벳을 사용하는 대표적인 문자 인코딩으로 7 비트로 모든 영어 알파벳을 표현할 수 있습니다. 52개의 영문 알파벳 대소문자와, 10개의 숫자, 32개의 특수 문자, 그리고 하나의 공백 문자를 포함합니다.
-ASCII를 확장한 형태가 유니코드이다.


# 유니코드(Unicode)
-유니코드 협회(Unicode Consortium)가 제정하는 전 세계의 모든 문자를 컴퓨터에서 일관되게 표현하고 다룰 수 있도록 설계된 산업 표준이다.
- 이 표준에는 ISO 10646 문자 집합, 문자 인코딩, 문자 정보 데이터베이스, 문자를 다루기 위한 알고리즘 등을 포함하고 있습니다.
-기본적으로 유니코드의 목적은 현존하는 문자 인코딩 방법을 모두 유니코드로 교체하는 겁니다.

#인코딩(부호화)
-어떤 문자나 기호를 컴퓨터가 이용할 수 있는 신호로 만드는 것.
-이 신호를 입력하는 인코딩과 문자를 해독하는 디코딩을 하기 위해서는 미리 정해진 기준을 바탕으로 입력과 해독이 처리되어야 합니다.
-이렇게 인코딩과 디코딩의 기준을 문자열 세트 또는 문자셋(charset)이라고 합니다. 이 문자셋의 국제 표준이 유니코드입니다.

<UTF-8과 UTF-16의 차이점은 무엇인가요>
-UTF-8과 UTF-16은 인코딩 방식의 차이를 의미합니다.
- UTF-8은 Universal Coded Character Set + Transformation Format – 8-bit의 약자로, UTF- 뒤에 등장하는 숫자는 비트(bit)입니다.

 

# UTF-8 특징: 가변 길이 인코딩
- UTF-8은 유니코드 한 문자를 나타내기 위해 1 byte(= 8 bits)에서 4 bytes까지 사용합니다.

// '코'라는 문자를 UTF-8로 표현.

let encoder = new TextEncoder(); // 기본 인코딩은 'utf-8'
encoder.encode('코') // Uint8Array(3) [236, 189, 148]

(236).toString(2) // "11101100"
(189).toString(2) // "10111101"
(148).toString(2) // "10010100"

// 'b'라는 문자를 UTF-8로 표현.

encoder.encode('b') // Uint8Array [98]
(98).toString(2) // "1100010"

-이처럼, UTF-8은 1 byte에서 4 bytes까지의 가변 길이를 가지는 인코딩 방식입니다.
네트워크를 통해 전송되는 텍스트는 주로 UTF-8로 인코딩됩니다.
-UTF-8은 ASCII 코드의 경우 1 byte, 크게 영어 외 글자는 2byte, 3byte, 보조 글자는 4byte를 차지합니다. 이모지는 보조 글자에 해당하기 때문에 4byte가 필요합니다.

# UTF-8 특징: 바이트 순서가 고정됨
-UTF-16에 비해 바이트 순서를 따지지 않고, 순서가 정해져 있습니다.

# UTF-16 특징: 코드 그대로 바이트로 표현 가능, 바이트 순서가 다양함
- UTF-16은 유니코드 코드 대부분(U+0000부터 U+FFFF; BMP) 을 16 bits로 표현합니다.
- 대부분에 속하지 않는 기타 문자는 32 bit(4 bytes)로 표현하므로 UTF-16도 가변 길이라고 할 수 있으나, 대부분은 2 바이트로 표현합니다

#UTF-8에서는 한글은 3 바이트, UTF-16에서는 2 바이트를 차지합니다.

 

---

<그래픽>
-비트맵(Bitmap)과 벡터(Vector)는 디지털 이미지의 종류입니다. 
-디지털 이미지, 또는 이미지라고 불리는 용어는 디지털 카메라를 이용하여 현실세계의 사물을 촬영하거나 스캐너를 이용하여 사진이나 그림을 디지털 형태로 받아들인 것을 가리킵니다. 
-서로 상반된 방식으로 이미지를 표현하기 때문에 비트맵(Bitmap)과 벡터(Vector)는 큰 차이점이 있습니다.

#비트맵(Bitmap) = 래스터그래픽(점 방식)
-웹 상에서 디지털 이미지를 저장하는 데에 가장 많이 쓰이는 이미지 파일 포맷 형식이다.
-이미지의 각 점들을 격자형의 픽셀 단위로 구성되며, 한 지역을 차지하는 셀은 위치에 따라 다른 값을 갖습니다.
-사각의 픽셀 형태로 모여 있기 때문에 확대를 하면 ‘계단현상’ 또는 ‘깨짐 현상’이 발생하며, 경계가 뚜렷하지 않다는 특징이 있습니다. 
-이런 식으로 픽셀 단위로 이미지를 표현하는 방식은 컴퓨터에게 부담을 덜 주는 구조로 되어 있습니다.
-픽셀 하나 당 모두 색상 값을 가지고 있습니다. 따라서 이미지의 사이즈가 커질수록 용량 또한 무거워진다는 특징이 있습니다.

#벡터(Vector)
-비트맵이 격자형의 픽셀 단위로 이미지를 구성한다면 벡터는 이미지를 수학적인 공식으로 표현을 합니다.
-점과 점을 연결해 선을 표현하고 선과 선을 연결해 면을 표현하는 식의 수학적 원리로 그림을 그린다.
-아무리 확대를 해도 ‘계단현상’ 또는 ‘깨짐 현상’이 발생하지 않습니다. 
-벡터 방식으로 이미지를 표현하는 것은 비트맵에 비해 컴퓨터에게 부담을 가하는 방식이므로 주로 도형, 글자 등을 그리는 작업에 사용됩니다.
- 수학적인 연산으로 만들어진 이미지이기 때문에 사이즈를 키워도 용량에는 변화가 없다.

---

출처

코드스테이츠