“foo（…arg）”（函数调用中的三个点）是什么意思？

Question

有人能说出“角度介绍”示例中下面代码中的“…”是什么吗？

getHeroes() {
    this.backend.getAll(Hero).then( (heroes: Hero[]) => {
      this.logger.log(`Fetched ${heroes.length} heroes.`);
      this.heroes.push(...heroes); // fill cache
    });

Answer 1

这是原始数组的副本

let args = [7, 3, 8];
var [h] = args.reverse(); // args is now 8, 3, 7

鉴于

var [h] = [...args].reverse(); // args is still 7, 3, 8

它也可以用来指定数组的剩余值

var [first, ...rest] = args; // first = 7, rest = [3, 8]

Answer 2

这是一个称为Rest参数的JavaScript特性。通过使用它，您的函数可以接受任意数量的参数。您将三个点放在参数前面（不带空格字符），然后机制为您展开它，就好像它是多个参数的列表一样。在雄辩的Javascript中，您有一个很好的例子。

let numbers = [5, 1, 7];
console.log(max(...numbers));
// -> 7

Answer 3

这与jQuery或Angular无关。这是ES2015中引入的一项功能。

…的这种特殊用法实际上没有正式名称。与其他用法一致的名称是“spread argument”（通用术语是“spread syntax”）。它“分解”（扩展）一个iterable，并将每个值作为参数传递给函数。你的例子相当于：

this.heroes.push.apply(this.heroes, Array.from(heroes));

除了更简洁之外，...的另一个优点是它可以更容易地与其他具体参数一起使用：

func(first, second, ...theRest);

// as opposed to the following or something similar:
 func.apply(null, [first, second].concat(Array.from(heroes)));