Notice
Recent Posts
Recent Comments
Link
«   2024/09   »
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30
Tags more
Archives
Today
Total
관리 메뉴

기초공사 (html,css,javascript)

백틱과 ${ } 본문

academy/JavaScript

백틱과 ${ }

에스프레소라떼 2024. 4. 30. 16:28

//

자바스트립트 ES6 부터는 백틱 기호를 사용한 문자열을 템플릿 리터럴이라고 부릅니다

console.log(language + "처음이죠?" + "Hello World" + language + "참 쉽죠?");

 

문자열을 연결하고 출력하려면 따옴표와 더하기(+) 기호를 사용해 위와 같이 사용해야 했습니다.

 

템플릿 문자열에서는 ${}(플레이스 홀더place holder라고 부릅니다)를 사용해 변수를 넣고

아래와 같이 따옴표와 더하기 기호를 빼고 쓸 수 있습니다.

onsole.log(`${language} 처음이죠? Hello World ${language} 참 쉽죠?`);


익숙해진다면, 같은 문자열이어도 더 간단하게 표현하는 것이 가능해지는 것이죠.
좀 더 어렵게 표현하자면, 내장된 표현식을 사용하는 것을 허용하며 여러 줄로 이루어진 문자열과 

문자를 연결해 줄바꿈 기호 없이 쓸 수 있습니다.

 

var a = 5;
var b = 10;
console.log("Fifteen is " + (a + b) + " and\nnot " + (2 * a + b) + ".");
// "Fifteen is 15 and
// not 20."

아래처럼 변경 가능하다.

var a = 5;
var b = 10;
console.log(`Fifteen is ${a + b} and
not ${2 * a + b}.`);
// "Fifteen is 15 and
// not 20."