我不确定如何解释这个问题，但是当我运行

console.log`1`

/>
为什么反引号为什么调用log函数，为什么它使索引为raw: Array[1]？

Catgocat在JS室提出的问题，但是除了其他问题之外，没有其他任何答案关于模板化与实际情况不符的字符串。

评论

相关：Javascript Es6标记模板-何时使用原始数据？什么时候使用？，ES6标记的模板函数如何解释其参数顺序？

#1 楼

在ES-6中被称为“标记模板”，可以在其中找到更多信息。有趣的是，我在聊天窗口的加星标部分中找到了链接。

但是代码的相关部分在下面（基本上可以创建一个经过筛选的排序。）

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将上述代码转换为

/>如您在上面的示例中看到的那样，在通过babel进行编译之后，将传递以下es6-> 5已编译代码的返回值的标记函数（console.log）。

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

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


此函数的返回值传递到console.log，该控制台随后将打印该数组。

评论

我发现这更容易理解explanantion- wesbos.com/tagged-template-literals

–戴夫·戴
18年11月27日在10:32

#2 楼

标记模板文字：
以下语法：
function`your template ${foo}`;

被称为标记模板文字。

被称为标记模板文字的函数接收其参数。以下列方式：



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

taggedTemplate`abc`;





第一个参数是所有单个字符串字符的数组。
其余参数与我们通过字符串插值接收的变量的值相对应。注意在示例中，arg4没有值（因为只有3次字符串内插），因此当我们尝试记录undefined时，使用剩余参数语法记录arg4：
如果我们事先不知道模板字符串中会进行多少次字符串内插，那么使用rest参数语法通常会很有用。此语法将函数接收的其余参数存储到数组中。例如：



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

taggedTemplate `abc`;
taggedTemplate `abcd`;




#3 楼

晚会晚了，但是，TBH，没有一个答案可以解释原始问题的50％（“为什么是raw: Array[1]”）
1。为什么可以使用反引号来调用不带括号的函数？函数将接收以下参数：

第一个参数：包含非表达式的字符串不同部分的数组。
其他参数：每个要插值的值（即

基本上，以下是“几乎”等同的内容：
不完全相同）
2。为什么["1", raw: Array[1]] ???
作为第一个参数传递的数组包含一个属性raw，它允许在输入原始字符串时访问它们（不处理转义序列）。
示例用例：
console.log`1`

什么，带有属性的数组？？？ ???
是的，因为JavaScript数组实际上是对象，所以它们可以存储属性。
示例：
// Tagged Template
fn`My uncle ${uncleName} is ${uncleAge} years old!`