Notice
Recent Posts
Recent Comments
Link
«   2025/08   »
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
31
Tags
more
Archives
Today
Total
관리 메뉴

코드로보시죠

[JavaScript-14] 템플릿 문자열 `${}` 본문

[JavaScript] 코드잇과 함께!

[JavaScript-14] 템플릿 문자열 `${}`

코드로 보시죠 2023. 9. 24. 03:34

템플릿 문자열은 파이썬으로 치면 포맷팅 기능인데요,

일반적으로 우리가 화면에 무언가를 출력할 때,

문자와 변수를 함께 출력하려면, +나 , 로 구분을 지어줘야 하는데요,

따옴표를 열고 닫는 일은 정말 번거롭죠.

 

그래서, 이것을 간단하게 하기 위해 템플릿 문자열을 사용하는데요,

바로 코드로 보시죠

//템플릿 문자열 사용 x

let year = 2000;
let month = 2;
let day = 1;

console.log('제 생년월일은' + year + '년' + month + '월' + day + '일입니다.');

//템플릿 문자열 사용
console.log(`제 생일은 ${year}년 ${month}월 ${day}일입니다.`);

어떤가요? 아래의 케이스가 훨씬 간편하죠?

사용 방법은, 문자열을 백틱으로 감싸주고, ${} 속에 변수나 연산, 함수호출 등등을 넣어주면 됩니다.

${}밖의 내용은 그대로 출력됩니다. 

 

한 가지 예시만 더 볼게요.

function sum(num1, num2){
    return num1 + num2;
};

console.log(`result is ${sum(1, 2)});

그럼, ${sum(1,2)}부분이 3으로 대체되겠죠?