Javascript 模板文本js

我无法理解此代码

值[0]

和

值[1]

var a = 5;
var b = 10;

function foo(strings, ...values) {
  let a = values[0];
  let b = values[1];
  return `Sum ${a + b}
    Product ${a * b} 
    Division ${b / a}`;
}

console.log(foo`Num1 ${a + 10}
    Num2 ${b * 2} 
    Num3 ${b / a}`);

这样使用的扩展运算符（…）将获取一组参数并将它们转换为数组

如果我说：

function foo(...args) {
  //do something
}

然后说：

foo(1, 2, 3, 4, 5)

args（在实际函数中）将等于[1,2,3,4,5]。 在您的示例中，值是一个数组，它从该数组中获取第一个值（值[0]）和第二个值（值[1]）。

这样使用的扩展运算符（…）将获取一组参数并将其转换为数组

如果我说：

function foo(...args) {
  //do something
}

然后说：

foo(1, 2, 3, 4, 5)

args（在实际函数中）将等于[1,2,3,4,5]。

---

在您的示例中，值是一个数组，它从该数组中获取第一个值（值[0]）和第二个值（值[1]）。

使用模板中的字符串数组作为第一个参数调用标记函数，然后使用每个占位符的值调用离散参数。rest参数（

…values

）将从第二个（在本例中）参数开始传递的所有值收集到一个数组中。因此，

values[0]

是调用

foo

的第一个占位符的值，

values[1]

是第二个占位符的值

没有充分的理由在

foo

中使用

…value

，然后从

value

中获取

a

和

b

，将

a

和

b

声明为命名参数会更简单、更清晰：

function foo(strings, a, b) {
  return `Sum ${a + b}
    Product ${a * b} 
    Division ${b / a}`;
}

var a=5；
var b=10；
函数foo（字符串，a，b）{
返回'Sum${a+b}
产品${a*b}
分部${b/a}`；
}
log（foo`Num1${a+10}
Num2${b*2}
Num3${b/a}`）使用模板中的字符串数组作为第一个参数调用标记函数，然后使用每个占位符的值调用离散参数。rest参数（
…values
）将从第二个（在本例中）参数开始传递的所有值收集到一个数组中。因此，
values[0]
是调用
foo
的第一个占位符的值，
values[1]
是第二个占位符的值

没有充分的理由在
foo
中使用
…value
，然后从
value
中获取
a
和
b
，将
a
和
b
声明为命名参数会更简单、更清晰：

function foo(strings, a, b) {
  return `Sum ${a + b}
    Product ${a * b} 
    Division ${b / a}`;
}


var a=5；
var b=10；
函数foo（字符串，a，b）{
返回'Sum${a+b}
产品${a*b}
分部${b/a}`；
}
log（foo`Num1${a+10}
Num2${b*2}
Num3${b/a}`）三个点（…）称为扩展语法。将参数传递给函数是一种更简洁的方法（特别是数组）

在你的情况下

console.log(foo`Num1 ${a + 10}
    Num2 ${b * 2} 
    Num3 ${b / a}`);

您在这里调用的
foo
函数有3个值15、10和2，它们作为
[15、10、2]
传递给函数，因此
值[0]
将是15，
值[1]
将是10，
值[3]
将是2。
这三个点（…）称为扩展语法。将参数传递给函数是一种更简洁的方法（尤其是数组）

在你的情况下

console.log(foo`Num1 ${a + 10}
    Num2 ${b * 2} 
    Num3 ${b / a}`);

您在这里调用带有3个值15、10和2的
foo
函数，这些值作为
[15、10、2]
传递给函数，因此
值[0]
将为15，
值[1]
将为10，
值[3]
将为2。
这是标记模板的示例。您可以使用函数来解析模板

var a = 5;
var b = 10;

function foo(strings, ...values) {
  let a = values[0];
  let b = values[1];
  console.log(a , b); 
}

foo`x dwqdwq ${a} qwdqwdy ${b}`;
// prints 5, 10


function foo2(strings, a, b, c) {
  console.log(a , b, c);
}

foo2`x dwqdwq ${1} qwdqwdy ${2} mmdwldw ${3}`;  
// prints 1, 2, 3

字符串
将是模板中字符串部分的数组。
这是标记模板的示例。您可以使用函数来解析模板

var a = 5;
var b = 10;

function foo(strings, ...values) {
  let a = values[0];
  let b = values[1];
  console.log(a , b); 
}

foo`x dwqdwq ${a} qwdqwdy ${b}`;
// prints 5, 10


function foo2(strings, a, b, c) {
  console.log(a , b, c);
}

foo2`x dwqdwq ${1} qwdqwdy ${2} mmdwldw ${3}`;  
// prints 1, 2, 3

strings
将是模板中字符串部分的数组。
注意：
…
在用于排列或静止时，既不是也不能是运算符。它做了操作员不能做的事情。注：
…
不是也不能是操作员，无论是用于排列还是静止。它做了操作员不能做的事情。我想你的密码有错吧？缺少
（
？@epascarello否，
foo`a template literal`
是有效语法。我假设您的代码中有一个拼写错误？缺少
（
？@epascarello不，
foo`a template literal`
是有效的语法。我能理解你的意思，但我不能理解这段代码的结果怎么能求和结果是35而不是15，乘积是300而不是50？？？@MostafaHamed-一般来说，理解这类事情的最好方法是由州议员逐项陈述t在调试器中。代码在
foo
中本地使用
a
和
b
，对外部
a
和
b
foo
进行阴影（隐藏）调用，调用值为
${a+10}/code>，为15（外部
a
为5），以及
${b*2}/code>，为20（外部的
b
是10）。因此总和是35，乘积是300，而
b/a
（
20/15
）是
1.3333333
。谢谢，我知道问题是什么，我能理解你的意思，但我不能理解这个代码的结果怎么能求和结果是35而不是15，乘积是300而不是50？？？@MostafaHamed-一般来说，理解这类事情的最好方法是在t中逐句逐句地通过它们代码在
foo
中本地使用
a
和
b
，对外部
a
和
b
foo
进行阴影（隐藏）调用，调用值为
${a+10}
，为15（外部
a
为5），以及
${b*2}
，为20（外部
b
为10）所以总和是35，乘积是300，
b/a
（
20/15
）是
1.3333
。谢谢
var a = 5;
var b = 10;

function foo(strings, ...values) {
  let a = values[0];
  let b = values[1];
  console.log(a , b); 
}

foo`x dwqdwq ${a} qwdqwdy ${b}`;
// prints 5, 10


function foo2(strings, a, b, c) {
  console.log(a , b, c);
}

foo2`x dwqdwq ${1} qwdqwdy ${2} mmdwldw ${3}`;  
// prints 1, 2, 3