جاوااسکریپت - روش تابعی برای پیمایش بازه (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;
});

که چیزی نبود که انتظارش را داشتم.

ویرایش :

@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);

پاسخ شماره ۲

پیشنهاد ES7

هشدار: متأسفانه، من فکر میcکنم اکثر پلتفرمcهای محبوب دیگر از درک مطلب پشتیبانی نمیcکنند. روش ES6 با پشتیبانی خوب را در زیر ببینید.

شما همیشه میتوانید از چیزی مثل استفاده کنید:

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

اجرای این کد روی فایرفاکس:

[ ۰، ۱، ۴، ۹، ۱۶، ۲۵، ۳۶ ]

این در فایرفاکس کار میکند (این یک ویژگی پیشنهادی ES7 بود)، اما از مشخصات حذف شده است. اگر درست به یاد داشته باشم، Babel 5 با فعال بودن «experimental» از این پشتیبانی میکند.

این بهترین گزینهی شماست زیرا درک آرایهها دقیقاً برای همین هدف استفاده میشوند. شما حتی میتوانید یک تابع محدوده بنویسید تا همراه با این استفاده شود:

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

ایاس ۶

یک روش خوب برای انجام این کار هر یک از:

[...Array(7).keys()].map(i => i * i);
Array(7).fill().map((_,i) => i*i);
[...Array(7)].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 زمانی است که یک آرگومان واحد به آن داده شود. ما از عملگر نفوذ (spread operator) برای ایجاد یک آرایه با پنج عنصر تعریفنشده استفاده میکنیم. سپس میتوانیم آن را map کنیم. ببینید 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)