JS중급_backtick, Tagged literals

Adrian·2022년 3월 1일
post-thumbnail

▶️ 백틱의 역할

  var word = `안녕
  하세요`

백틱은 자바스크립트에서 문자를 다루기 힘든 점을 보완하기 위해 나온 문법이다. 기존 문자열과는 다르게 백틱을 사용하면 위처럼 문자 중간에 엔터키를 쓸 수 있다.

var name = 'heung min-son';
var word = `Hello, my name is ${name}`;

var template_HTML = `
	<div>
		<div>
			<p> ${name} </p>
		</div>
	</div>
`

백틱으로 문자를 만들면 중간에 변수명을 쉽게 집어 넣을 수 있다.


▶️ Tagged Literal

	var name = '손흥민';
	
	function dissolver(){
    	return 10
    }
	
	dissolver`안녕하세요 ${name} 입니다`;
  • Tagged literals는 문자 해체분석기능을 만들어주는 함수이다.
  • 함수 뒤에 문자를 붙여 실행하면 그 문자열을 해체 분석할 수 있기 때문이다.
	var name = '손흥민';
	
	function dissolver(literals, variables){
    	console.log(literals);
      	console.log(variables);
    }
	
	dissolver`안녕하세요 ${name} 입니다`;

literals는 백틱 내의 순수 문자만 골라서 배열로 만든 파라미터이고, variables는 백틱 내의 ${} 변수를 담는 파라미터이다. 백틱 내의 변수가 여러개일 경우 파라미터를 뒤에 더 추가해주면 된다.


profile
관조, 사유, 끈기

0개의 댓글