函数式方法遍历范围(ES6/7)

以更实用的方式(使用 ES6/ES7)执行以下操作的最佳方法是什么

let cols = [];
for (let i =0; i <= 7; i++) {
cols.push(i * i);
}
return cols;

我试着说,

return [ ...7 ].map(i => {
return i * i;
});

但是这意味着

[].concat(7).map(function (n) {
return n * n;
});

我没想到会这样。

编辑:

事实上，这是一个错误。我正在使用 JSX，例如，我想要7个 div，(未经测试)

let cols = [];
for (let i =0; i <= 7; i++) {
cols.push(<div id={i}> ...  </div>)
}
return cols;

所以这个想法的确是为了减少临时变量的数量和过程的感觉。

178090 次浏览
小开

ES7建议

警告: 不幸的是，我相信大多数流行的平台已经放弃了对理解的支持

你总是可以使用这样的东西:

[for (i of Array(7).keys()) i*i];

在 Firefox 上运行这段代码:

[0,1,4,9,16,25,36]

这在 Firefox 上是可行的(这是一个被提议的 ES7特性) ，但是它已经从规范中去掉了。IIRC，启用了“实验”功能的 Babel 5支持这一点。

这是您的最佳选择，因为数组理解仅用于此目的。你甚至可以写一个 range 函数:

var range = (u, l = 0) => [ for( i of Array(u - l).keys() ) i + l ]

然后你可以做:

[for (i of range(5)) i*i] // 0, 1, 4, 9, 16, 25
[for (i of range(5,3)) i*i] // 9, 16, 25

ES6

一个不错的方法:

[...Array(7).keys()].map(i => i * i);
Array(7).fill().map((_,i) => i*i);
[...Array(7)].map((_,i) => i*i);

这将产生:

[0,1,4,9,16,25,36]

小开
最佳答案

可以创建一个空数组，填充它(否则 map 将跳过它) ，然后将索引映射到值:

Array(8).fill(0).map((_, i) => i * i);
小开

下面是一个使用发电机的方法:

function* square(n) {
for (var i = 0; i < n; i++ ) yield i*i;
}

然后你就可以写作了

console.log(...square(7));

另一个想法是:

[...Array(5)].map((_, i) => i*i)

Array(5)创建一个未填充的五元素数组。这就是 Array在给定单个参数时的工作方式。我们使用扩展运算符创建一个包含五个未定义元素的数组。然后我们可以绘制地图。见 http://ariya.ofilabs.com/2013/07/sequences-using-javascript-array.html。

或者，我们可以写

Array.from(Array(5)).map((_, i) => i*i)

或者，我们可以利用 Array#from的第二个参数跳过 map并编写

Array.from(Array(5), (_, i) => i*i)

我最近看到一个可怕的黑客，我推荐你使用 没有

[...1e4+''].map((_, i) => i*i)

提交答案