[개발] 자바스크립트에서 문자열 표기와 태그펑션 tag function

[개발] 자바스크립트에서 문자열 표기와 태그펑션 tag function

안녕하세요.

열심히 블록체인업계에서 꿈을 키우고 있는 minhoyoo 입니다

[이하는 ES6기준으로 작성하겠습니다]

간단하게 자바스크립트에서 문자열 표기하는 방법과b

ES6에서 사용할 수 있는 제가 새로 알게된 문법이 있어 공유하려합니다.

자바스크립트에서 문자열을 표기하려면 다음과 같이 표현 할 수 있죠

//1. '' 이용, quotation
console.log('\'안녕하세요\' "jjangjjangman" `짱짱`');
//'안녕하세요' "jjangjjangman" `짱짱`

//2. "" 이용, double quotation
console.log("'안녕하세요' \"jjangjjangman\" `짱짱`");
//'안녕하세요' "jjangjjangman" `짱짱`

//3. `` 이용,  back-tick
console.log(`'안녕하세요' "jjangjjangman" \`짱짱\`");
console.log(`'안녕하세요' "jjangjjangman" \`짱짱\`${'스팀늅늅'} ${'가즈아'}`);
//'안녕하세요' "jjangjjangman" `짱짱`
//'안녕하세요' "jjangjjangman" `짱짱`스팀늅늅 가즈아

그리고 태그 펑션 tag function 입니다.

아마 정확히는 javascript의 문자열문법(Tagged templates)에서의 Tagged templates pattern 이라고 해야 맞지 않을까 싶은데요.

형태는 다음과 같습니다

function tag(strings) {
console.log(strings)
console.log(strings.raw)
console.log(strings.raw[0])
}
tag`보팅은 ${'minhoyoo'} 에게 ${'큰'} 힘이 됩니다`
// ["보팅은 ", " 에게 ", " 힘이 됩니다", raw: Array(3)]
// ["보팅은 ", " 에게 ", " 힘이 됩니다"]
//  보팅은 

이렇게도 사용할수 있네요.

const texts = [
  {text: '보팅은'},
  {text: '저에게'},
  {text: '큰힘이'},
  {text: '됩니다'}
]
function say(arr, n) {
  console.log(arr[0] + n + arr[1] );
}
texts.forEach((p) => {
  say` text: ${p.text} !!? `;
});

자바스크립트 내에서 문자열을 표현하는 방법이 여러가지 있네요.

어떤 문법들은 가독성 측면에서 안좋다 말이 많지만,
그래도 여러가지 알아두면 언젠가는 편하게 쓸 때가 있지 않을까 싶습니다.

^^..

참고
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals#Tagged_template_literals
https://codeburst.io/javascript-what-are-tag-functions-97682f29521b