JavaScript에서 `console.log`1이 `[\'1\', raw: Array[1]]`를 출력하는 이유는 무엇입니까?

백틱의 수수께끼 풀기: JavaScript에서 함수 호출

JavaScript 영역에서 겸손한 백틱(…)은 신비한 힘을 가지고 있습니다. , 기능을 원활하게 호출할 수 있습니다. 그러나 이러한 현상은 숙련된 개발자들조차 당황하게 만들 수 있습니다. console.log1` 코드에서 "console.log1`nVM12380:2 ["1", raw: Array[1]]"과 같은 예기치 않은 출력이 발생하는 이유는 무엇입니까?

답은 Tagged 개념에 있습니다. ES-6에 도입된 흥미로운 기능인 템플릿. 태그가 지정된 템플릿을 사용하면 개발자는 함수로 템플릿 문자열에 태그를 지정하여 해당 문자열의 구문 분석된 값에 대해 작업을 수행할 수 있습니다.

이 예에서 백틱(…)은 콘솔에서 리터럴 문자열 "1"에 태그를 지정합니다. 로그 기능. 다른 함수와 마찬가지로 태그가 지정된 함수는 문자열 자체와 원시 값을 포함하는 배열인 템플릿 문자열의 구문 분석된 값을 수신합니다.

console.log와 같은 태그가 지정된 함수는 문자열 템플릿을 처리하기 전에 문자열 템플릿을 처리할 수 있습니다. 산출. 이 경우 함수는 단지 수신한 배열을 인쇄하여 우리가 관찰한 결과를 얻습니다.

인기 있는 JavaScript 트랜스파일러인 Babel은 태그된 템플릿 코드를 ES-5와 더 호환되는 형식으로 변환합니다. 우리의 경우 다음 코드가 생성됩니다.

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

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

_taggedTemplateLiteralLoose 함수는 태그가 지정된 템플릿을 반환한 다음 console.log에 전달됩니다. 이는 배열 ["1", raw: Array[1]]이 콘솔에 인쇄되는 이유를 설명합니다.

따라서 백틱의 힘은 기능을 활성화하는 메커니즘인 태그된 템플릿을 용이하게 하는 능력에 있습니다. 태그가 지정된 문자열을 처리하고 향상하여 JavaScript 프로그래밍의 가능성을 열어줍니다.

위 내용은 JavaScript에서 `console.log`1이 `[\'1\', raw: Array[1]]`를 출력하는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!