자바스크립트에서 텍스트를 다루는 **문자열(String)**은 모든 웹 개발의 기본입니다. 자바스크립트는 글자 하나만을 위한 별도의 타입이 없으며, 모든 텍스트는 UTF-16 형식의 문자열로 저장됩니다.

---

🏗️ 1. 따옴표와 템플릿 리터럴

자바스크립트에는 세 가지 따옴표가 있습니다.

• 작은따옴표(' '), 큰따옴표(" "): 기능 차이가 없으며 단일 줄 텍스트에 쓰입니다.
• 백틱( ): 가장 강력하며, 현대적인 코드에서 권장됩니다.
  • 변수 삽입: ${...}을 통해 문자열 안에 표현식을 직접 넣을 수 있습니다.
  • 여러 줄 작성: 별도의 특수 기호 없이 엔터(Enter)만으로 줄 바꿈이 가능합니다.

let name = "도완";
// 백틱의 위력
console.log(`안녕하세요,
${name}님! 연산 결과: ${1 + 2}`);

---

📏 2. 길이와 특정 글자 접근

문자열의 길이 (length)

• str.length는 함수가 아닌 프로퍼티입니다. 뒤에 괄호를 붙이지 않도록 주의하세요.
• \n 같은 특수 문자는 한 글자로 취급됩니다.

글자 접근하기

• str[pos]: 현대적인 방식입니다. 범위를 벗어나면 undefined를 반환합니다.
• str.charAt(pos): 하위 호환을 위한 방식입니다. 범위를 벗어나면 빈 문자열("")을 반환합니다.

---

🔒 3. 문자열의 불변성 (Immutability)

자바스크립트의 문자열은 한 번 생성되면 수정할 수 없습니다.

• str[0] = "h" 처럼 특정 위치의 글자를 직접 바꾸려 하면 에러가 발생하거나 무시됩니다.
• 수정이 필요하다면 새로운 문자열을 만들어 기존 변수에 재할당해야 합니다.

---

🔍 4. 부분 문자열 찾기 및 추출

문자열 찾기

1. includes(substr, pos): 존재 여부만 확인할 때 가장 좋습니다 (true/false).
2. indexOf(substr, pos): 위치 인덱스가 필요할 때 씁니다. 못 찾으면 1을 반환합니다.
   • ⚠️ if (str.indexOf("..."))는 0번째 위치를 false로 인식하므로 반드시 != -1로 체크해야 합니다.
3. startsWith / endsWith: 특정 문자로 시작하거나 끝나는지 확인합니다.

문자열 추출 (핵심 비교)

메서드	인자	특징
slice(start, end)	시작부터 끝까지(끝 미포함)	가장 권장. 음수 인덱스(뒤에서부터) 허용.
substring(start, end)	사이 구간	음수 미지원(0으로 처리). start > end여도 동작.
substr(start, len)	시작부터 n개	사용 지양(명세서 부록에 정의된 구식 메서드).

---

🌐 5. 문자열 비교와 유니코드

• 대소문자 구분: 'a' > 'Z'는 true입니다. 소문자의 유니코드 번호가 더 크기 때문입니다.
• localeCompare: 언어별 규칙(예: 독일어 Österreich)에 따라 정확하게 비교해야 할 때 사용합니다.
• 서로게이트 쌍 (Surrogate Pair): 이모지(😂)나 희귀 문자는 내부적으로 2글자(4바이트)를 차지하여 .length가 2로 나옵니다.

---

🎙️ 기술 면접 대비 (Interview Questions)

Q1. 문자열의 특정 인덱스 값을 str[0] = 'A'와 같이 직접 수정할 수 없는 이유는 무엇인가요? (기초)

답변: 자바스크립트에서 문자열은 **원시 타입(Primitive Type)**이며 **불변(Immutable)**하기 때문입니다. 메모리에 저장된 문자열 데이터 자체를 변경하는 것은 불가능하며, 수정을 원한다면 새로운 문자열을 생성하여 변수에 다시 할당하는 방식으로 처리해야 합니다.

Q2. indexOf 대신 includes를 사용하는 것이 더 좋은 상황은 언제인가요? (중급)

답변: 단순히 특정 문자열이 포함되어 있는지 여부(Boolean)만 판단할 때는 includes가 가독성이 훨씬 좋습니다. indexOf는 결과값이 0일 때 if문에서 falsy로 처리되는 실수를 유발할 수 있지만, includes는 의도를 명확히 드러내며 에러 가능성을 줄여줍니다.

Q3. 이모지(😂)의 .length가 2가 나오는 현상을 어떻게 설명할 수 있나요? (심화)

답변: 자바스크립트는 내부적으로 UTF-16 인코딩을 사용합니다. 대부분의 문자는 2바이트(16비트)로 표현되지만, 표현 범위를 넘어서는 이모지 등은 2바이트짜리 코드 두 개를 조합한 **'서로게이트 쌍(Surrogate Pair)'**으로 저장됩니다. .length 프로퍼티는 이 코드 단위의 개수를 세기 때문에 2가 반환되는 것입니다.

---