[解決済み] 範囲を反復処理する関数的な方法 (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;
});

というのは、私が期待していたのとは違う。

EDITです。

@pavloです。確かに、それは間違いでした。JSXを使っていたのですが、例えば7つのdivが欲しい場合、（未検証ですが）

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

ということで、確かにテンポラリー変数や手続き的な感覚を減らすという発想はありました。

解決方法は？

空の配列を作成し、それを埋めて (さもなければ map がそれをスキップします)、それからインデックスを値にマップすることができます。

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