여러 줄 문자열
이스케이프 없이 읽기 쉬운 여러 줄 텍스트를 작성합니다.
여러 줄 문자열은(는) CoddyKit의 무료 JavaScript Academy 강의입니다. 이것은 4개 중 2번째 강의입니다. 아래에서 전체 강의를 무료로 읽을 수 있으며, 내장 코드 에디터와 24/7 AI 튜터와 함께 브라우저에서 직접 실습할 수 있습니다. 이 강의는 JavaScript Academy 학습 경로의 일부이며, 진행 상황이 웹과 CoddyKit 앱에 동기화됩니다. JavaScript Academy 강의에는 총 4개의 강의가 포함되어 있습니다.
기존 방식
템플릿 리터럴이 없던 시절에는 여러 줄 문자열을 만들려면 명시적인 줄 바꿈 이스케이프 시퀀스를 사용하거나 여러 줄에 걸쳐 문자열을 연결해야 했습니다. 이 방식은 장황하고 오류가 발생하기 쉬웠습니다.
const old = "Line 1\nLine 2\nLine 3"
console.log(old)템플릿 리터럴은 여러 줄에 걸쳐 작성 가능
백틱으로 작성한 템플릿 리터럴에는 소스 코드의 실제 줄 바꿈을 포함할 수 있습니다. 입력한 모든 줄 바꿈이 문자열의 줄 바꿈이 됩니다.
실행 가능한 예제에서는 이스케이프 시퀀스를 사용하여 같은 출력을 재현합니다.
const text = "First\nSecond\nThird"
console.log(text)공백 유지
여러 줄 템플릿 안의 들여쓰기와 공백은 작성한 그대로 정확히 유지됩니다. 형식이 지정된 출력을 만들 때 중요한 특징입니다.
const block = " indented\n more indented"
console.log(block)문단 만들기
여러 줄 문자열은 텍스트 문단, 이메일 본문 또는 템플릿을 만들 때 편리합니다. 여기서는 짧은 메시지를 조합합니다.
const msg = "Dear user,\n\nThank you for joining.\n\nBest regards"
console.log(msg)줄 수 세기
여러 줄 문자열을 줄 바꿈 문자로 split하여 각 줄의 개수를 세거나 개별 줄을 처리할 수 있습니다.
const text = "a\nb\nc\nd"
const lines = text.split("\n")
console.log("Lines: " + lines.length)여러 줄 문자열로 결합하기
줄 배열은 줄 바꿈 구분 기호와 함께 join하여 프로그래밍 방식으로 여러 줄 문자열을 만들 수 있습니다.
const parts = ["one", "two", "three"]
console.log(parts.join("\n"))보간과 함께 사용하기
여러 줄 템플릿에도 자리 표시자를 넣어 동적 값과 줄 바꿈을 섞을 수 있습니다. 예제에서는 결과를 보여 주기 위해 문자열 연결을 사용합니다.
const name = "Sam"
const body = "Hello " + name + ",\nWelcome aboard."
console.log(body)탭과 특수 문자
여러 줄 문자열 안에서도 탭 이스케이프 시퀀스를 사용하여 탭 문자를 넣고 열을 맞출 수 있습니다.
const table = "Name\tAge\nAlice\t30\nBob\t25"
console.log(table)불필요한 줄 제거하기
여러 줄 문자열에는 앞이나 뒤에 빈 줄이 포함되는 경우가 있습니다. trim 메서드는 줄 바꿈을 포함한 주변 공백을 제거합니다.
const raw = "\n\nHello\n\n"
console.log("[" + raw.trim() + "]")코드 텍스트 생성하기
여러 줄 문자열은 소스 코드 조각이나 설정을 텍스트 출력으로 내보낼 때 유용합니다.
const code = "function add(a, b) {\n return a + b\n}"
console.log(code)줄 길이 인식하기
여러 줄 템플릿에는 입력한 모든 줄 바꿈이 포함된다는 점을 기억하십시오. 실수로 넣은 줄 바꿈은 예상하지 못한 공백을 만들 수 있으므로 의도적으로 형식을 지정하십시오.
const a = "no break here and here"
console.log(a.length)빠른 확인
여러 줄 문자열에 대한 이해도를 확인해 보십시오.
요약
요약: 템플릿 리터럴을 사용하면 실제 여러 줄 텍스트를 작성할 수 있습니다.
- 소스 코드의 줄 바꿈이 문자열의 줄 바꿈이 됩니다
- 공백이 정확히 유지됩니다
- 보간과 결합하여 동적인 블록을 만들 수 있습니다
- split과 join을 사용하여 줄을 처리하십시오
console.log("Line A\nLine B")자주 묻는 질문
“여러 줄 문자열” 강의는 무료인가요?
네 — “여러 줄 문자열” 전체 내용을 이 웹사이트에서 무료로 읽을 수 있습니다. 인터랙티브하게 실습하려면(내장 코드 에디터와 24/7 AI 튜터), CoddyKit PRO로 업그레이드하면 JavaScript Academy 강의 전체를 잠금 해제할 수 있습니다. JavaScript Academy 강의에는 총 4개의 강의가 포함되어 있습니다.
“여러 줄 문자열”에서 뭘 배우나요?
이스케이프 없이 읽기 쉬운 여러 줄 텍스트를 작성합니다. 브라우저에서 직접 실행하는 실습 코드로 JavaScript Academy을(를) 배우며, 24/7 AI 튜터가 강의를 진행하면서 질문에 답변해줍니다.
JavaScript Academy을(를) 시작하는 데 경험이 필요한가요?
사전 경험은 필요하지 않습니다. CoddyKit의 JavaScript Academy은(는) 초급자부터 고급 학습자까지를 위해 구성되어 있으므로, 여기서 시작하거나 처음부터 시작할 수 있으며 자신의 속도대로 진행할 수 있습니다. 이것은 4개 중 2번째 강의입니다.
“여러 줄 문자열” 강의는 얼마나 걸리나요?
대부분의 CoddyKit 강의는 약 5~10분이 소요됩니다. 각 강의는 간결하고 인터랙티브하여 꾸준한 진행이 가능하며, 웹과 앱에서 중단한 부분부터 바로 시작할 수 있습니다.
이 JavaScript Academy 강의에서 코드를 작성하고 실행할 수 있나요?
네. 모든 JavaScript Academy 강의에는 내장 코드 에디터가 포함되어 있으므로, 브라우저에서 바로 실제 코드를 작성하고 실행한 후 즉시 AI 피드백을 받을 수 있습니다 — 로컬 설정이 필요 없습니다.