[Javascript] 문자열 줄바꿈하는 2가지 방법 (여러줄 표현하기)

 

Javascript의 문자열에서 줄바꿈을 표현하는 2가지 방법을 소개합니다.

 

1. escape 문자 사용하기
2. 템플릿 리터럴(Template literals) 사용하기

 

 

1. escape 문자 사용하기

<pre id='result'></pre>

const str = 'a\nb\nc\n';

document.getElementById("result").innerHTML=str;

문자열에  New Line을 뜻하는 '\n' 이스케이프 문자를 넣어주면 줄바꿈됩니다.

 

 

 

2. 템플릿 리터럴(Template literals) 사용하기

<pre id='result'></pre>

const str =`a
b
c`;

document.getElementById("result").innerHTML=str;

문자열 안에 escape문자인 '\n'을 사용하면, 가독성이 떨어지는 단점이 있습니다.

문자열을 정의할 때 따옴표( ' 또는 " )를 사용하는 대신 백틱(`)을 사용하면,

escape문자를 사용하지 않아도,

입력한 그대로 문자열이 표현됩니다.

백틱을 이용하여 문자열을 표현하는 것을 템플릿 리터럴(Template literals)라고 합니다.

백틱을 입력할 때는 키보드의 왼쪽 상단(esc키 밑, 숫자 1왼쪽)의 키를 이용합니다.