什么相当于 ES2016 或更高版本中的列表理解？答案

【问题标题】：What's the equivalent of a list comprehension like this one in ES2016 or greater?什么相当于 ES2016 或更高版本中的列表理解？
【发布时间】：2017-12-31 19:54:14
【问题描述】：

Python 3.6：

[f"Cat #{n}" for n in range(5)]

给予

['Cat #0', 'Cat #1', 'Cat #2', 'Cat #3', 'Cat #4']

JavaScript 新手，新 EcmaScript 中的等价物是什么？

【问题讨论】：

这能回答你的问题吗？ Does JavaScript support array/list comprehensions like Python?

标签： javascript python arrays ecmascript-6 list-comprehension

【解决方案1】：

console.log( [...Array(5)].map((v, i) =&gt; `Cat #${i}`) )

如果它也必须在 IE 中工作：

console.log( Array.apply(0, Array(5)).map(function(v, i) { return 'Cat #' + i; }) )

【讨论】：

【解决方案2】：

使用Generator 和Spread Operator 的组合。

ES2015：

[...(function*(){for(let n=0;n<5;)yield'Cat #'+n++})()]

给予

["Cat #0", "Cat #1", "Cat #2", "Cat #3", "Cat #4"]

【讨论】：

【解决方案3】：

JS 中的Array comprehension 是为 ES2016 提出的，但从未进入最终版本。 Firefox 曾一度支持推导式，但在后来的版本中不再支持。

您可以使用Array#from 来获得接近理解的内容。

const result = Array.from({ length: 5 }, (_, k) => `Cat #${k}`);

console.log(result);

【讨论】：

这是Array.from的巧妙运用！出于某种原因，Array.fill.map 在 Chrome/Firefox 中更快，但它的可读性大大。

【解决方案4】：

在 Javascript 中没有什么比这更可爱的了。据我所知，您需要创建一个新数组并使用.fill() 使每个元素都不是undefined。然后您可以使用.map 并返回/使用数组索引而不是值。像这样的：

console.log((new Array(5)).fill(0).map((x,i) =&gt; `Cat ${i}`))

您可能会发现生成器很有用：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Generator_comprehensions

【讨论】：