함수를 호출하는 백틱

함수를 호출하는 백틱

---

어떻게 설명 해야할지 모르겠지만 달리면

console.log`1`

Google 크롬에서 다음과 같은 출력을 얻습니다.

console.log`1`
VM12380:2 ["1", raw: Array[1]]

백틱이 로그 함수를 호출하는 이유는 무엇 이며 왜 색인을 생성 raw: Array[1]합니까?

Catgocat에 의해 JS 방에서 질문이 제기, 왜 이런 일이 발생하는지에 맞지 않는 템플릿 에 대한 것 외에는 어떤 대답도 의미 가 없습니다.

---

그것은 ES-6에서 Tagged Template이라고 불립니다. 더 많은 것을 읽을 수 있습니다. 여기 , 웃기게도 채팅의 별표 섹션에서 링크를 찾았습니다.

그러나 코드의 관련 부분은 다음과 가변적이다 (기본적으로 필터링 된 것이 만들 수 있음).

function tag(strings, ...values) {
  assert(strings[0] === 'a');
  assert(strings[1] === 'b');
  assert(values[0] === 42);
  return 'whatever';
}
tag `a${ 42 }b`  // "whatever"

console.log 함수로 "1"에 태그를 지정합니다. 태그 지정 함수는 템플릿의 구문 분석 된 값과 추가 작업을 수행 할 수있는 값을 식별 적으로 허용합니다.

Babel은 위 코드를 다음과 같이 변환합니다.

var _taggedTemplateLiteralLoose = function (strings, raw) { strings.raw = raw; return strings; };

console.log(_taggedTemplateLiteralLoose(["1"], ["1"]));

위의 예에서 볼 수 파일에 의해 전송 파일 된 후 태그 지정 함수 (console.log)는 전송 된 다음 es6-> 5 코드의 반환 값을 전달합니다.

_taggedTemplateLiteralLoose ([ "1"], [ "1"]);

이 함수의 반환 값은 console.log에 전달되어 배열을 인쇄합니다.

---

태그가 지정된 템플릿 리터럴 :

다음 구문 :

function`your template ${foo}`;

태그가 지정된 템플릿 리터럴 이라고합니다 .

---

태그가 지정된 템플릿 리터럴로 호출되는 함수는 다음과 같은 방식으로 인수를받습니다.

function taggedTemplate(strings, arg1, arg2, arg3, arg4) {
  console.log(strings);
  console.log(arg1, arg2, arg3, arg4);
}

taggedTemplate`a${1}b${2}c${3}`;

1. 첫 번째 인수는 모든 고유 문자의 배열입니다.
2. 나머지 인수는 공유 보간을 통해받은 변수의 값과 일치합니다. 예제에서 arg4(문자열 보간이 3 배 때문에 없기 때문에) 값이 undefined로그를 시도 할 때 기록됩니다.arg4

나머지 매개 변수 구문 사용 :

미리 알 수없는 경우에 사용하는 것이 유용합니다. 이 구문은 함수가 수신하는 나머지 인수를 배열에 저장합니다. 예를 들면 :

function taggedTemplate(strings, ...rest) {
  console.log(rest);
}

taggedTemplate `a${1}b${2}c${3}`;
taggedTemplate `a${1}b${2}c${3}d${4}`;

참고 URL : https://stackoverflow.com/questions/29660381/backticks-calling-a-function