传播可迭代的..obj[Symbol.iterator](..).

Question

我理解以下大部分代码，但我完全停留在[...numbers[Symbol.iterator]上。

var numbers = {
*[Symbol.iterator]({
start = 0,
stop = 100,
step = 1
} = {}) {
for(let x = start; x <= stop; x+=step) {
yield x;
}
}
};
// should print 0.. 100 in steps of 1
for(let num of numbers) {
console.log(num);
}
// should print 6..30 in steps of 4
console.log(`My lucky numbers are: ${
[...numbers[Symbol.iterator]({
start: 6,
stop: 30,
step: 4
})]}`
);

在我的脑海里：

如果只是[...numbers]，它将分散数字 0 - 100，因为对象具有迭代器函数/生成器。 如果只是numbers[Symbol.iterator]()它会查找并返回生成器。

但我对[...numbers[Symbol.iterator](...)一无所知，这看起来像是两者的奇怪组合。

在谷歌搜索此语法时，我正在努力获得结果。如果有人能像我 5 岁一样解释它，那将不胜感激！

Answer 1

这真的很奇怪Symbol.iterator用法，你通常不应该给他们参数。你可以把它拆开成

const generatorFunction = numbers[Symbol.iterator];
const iterator = generatorFunction({
start: 6,
stop: 30,
step: 4
});
const array = [...iterator];
console.log(`My lucky numbers are: ${array}`);

请注意，iterator是可迭代的，它继承了一个返回自身的[Symbol.iterator]方法，这允许它在数组 spread 元素中使用。生成器方法(此处明确调用(也被命名为[Symbol.iterator]并不重要，它只会导致混淆。更好的写法是

const numbers = {
*range(start, stop, step=1) {
for(let x = start; x <= stop; x+=step) {
yield x;
}
},
[Symbol.iterator]() {
return this.range(0, 100);
},
};
console.log([...numbers.range(6, 30, 4)]);

Answer 2

我原本不明白贝尔吉回答的前半部分

当被视为将点差运算符留到最后时，它变得很清楚(至少对我的大脑而言(，公平地说，这正是他解释的，但我看不到它。

无论如何：

[numbers[Symbol.iterator]({...})]返回生成器，然后展开。