자바스크립트 ES6 문법 - 템플릿 문자열

자바스크립트 ES6 문법 - 템플릿 문자열

 

문자열 합치기

var string1 = '스트링1';
var string2 = '스트링2';

// 기존 JS
var greeting = string 1 + ' ' + string2;

// ES6 문법
var greeting = `${string1} ${string2}`;

 

객체 자료형 사용

var data = { name : '전산이' , age : 19 };

// 기존 JS
var string = data.name + '의 나이는' + data.age + '입니다';

// ES6 문법
var string = `${data.name}의 나이는 ${data.age}입니다`;

 

줄바꿈

// 기존 JS
var multiline = '1열\n2열';

// ES6 문법
var multiline = `1열
2열`;

 

문자열 안에 연산결과

var data1 = 1;
var data2 = 2;
var boolval = false;

// 기존 JS
var oper1 = '곱한값은 ' + (data1 * data2) + '입니다';
var oper2 = 'bool값은 ' + (boolval ? '참' : '거짓') + '입니다';

// ES6 문법
var oper1 = `곱한값은 ${data1 * data2}입니다`;
var oper2 = `bool값은 ${boolval ? '참' : '거짓'}입니다`;