JSP model 값과 javascript 변수값 구분하고 싶을 때(JSP에서 javascript 템플릿 리터럴(template literals) 사용하기)

JSP로 화면작업을 하다보면 javascript 도 함께 사용을 많이 하게 됩니다. 

이 때 javascript의 유용한 문법인 템플릿 리터럴(template literals) 를 쓰려고 하다보면 문제가 생깁니다. 

(템플릿 리터럴은 변수값을 ${변수명} 으로 표현하고 일반 텍스트와 함께 작성하고 백틱(`)으로 묶어서 변수값이나 console.log에 활용하는 방식을 말합니다.)

 

예를 들어 아래와 같은 javascript를 단독으로 쓴다면 문제는 없습니다. 

const name = "노트북";
const price = 1000000;

console.log(`${name}의 가격은 ${price} 원 입니다.`);

 

하지만 위의 내용을 JSP파일에 작성하게 되면 JSP는 ${} 표현을 model에 담긴 값으로 인식하여 제대로 처리를 하지 못하는 경우가 발생합니다. 

이런 상황에서는 아래와 같이  \ 기호를 추가해주면 됩니다. 

const name = "노트북";
const price = 1000000;

console.log(`\${name}의 가격은 \${price} 원 입니다.`);

위와 같이 작성하면 model 값과 구분을 하여 활용이 가능합니다.