2. Template Literals

어니언·2023년 1월 13일
0

++

템플릿리터럴은 ES6 버전으로 업그레이드 되면서 문자열 연결방식중 하나인데 기존의 ""와 + 를 이용한 문자열의 복잡하고, 가독성이 떨어지는 문제점을 해결한 방식입니다.

과거의 방식은
"안녕하세요. 저는 "+ name + "입니다. 만나서 반갑습니다."
인데, 지금은 변수가 하나라서 큰차이가 없어보이고 더 편하게 읽힐 수 있지만, 변수명이 많아진다면 큰따옴표와, +의 숫자가 많아져 가독성과 유지보수 측면에서 관리하기가 어려울 것이다.

그럼 템플릿 리터럴을 사용하는 방법에 대해서 알아보면 백틱을 사용하면서 백틱내부에서 변수를 이용할 때에는 ${}의 중괄호안에 입력을 하면 된다. 구조를 살펴보면
안녕하세요. 저는 ${name] 입니다. 만나서 반갑습니다.
이렇게 표현 할 수 있습니다. 한번의 백틱사용으로 처음과 끝을 지정하고, 그내부에서 변수는 ${}를 이용해서 하기 때문에 훨씬 읽기 쉽고 유지보수 측면에서도 나을 것이다.

또한 백틱안에서는 여러 줄의 문자열을 따로 나눠 작성할 필요없이 그냥 작성해주면 된다.

두가지 방법 이용이 가능하기 때문에 개인이 생각 했을 때 상황에 맞게 편한 방법을 써주면 될 것 같다.

profile
안녕하세요.

0개의 댓글