تفاوت‌های کلیدی حلقه‌های for...of و for...in در جاوااسکریپت
در جاوااسکریپت، دو نوع حلقه پرکاربرد برای پیمایش عناصر وجود دارد: for...of و for...in. اگرچه هر دو برای تکرار استفاده می‌شوند، اما تفاوت‌های اساسی در عملکرد و کاربرد دارند که درک آن‌ها برای توسعه‌دهندگان حیاتی است.
حلقه for...in برای چه مواردی استفاده می‌شود؟
- برای پیمایش خصوصیات شمارش‌پذیر (enumerable) object) طراحی شده است
- مخصوص کار با اشیاء و کلیدهای آن‌ها (properties) است
- مقادیر prototype را نیز در حلقه نمایش می‌دهد (مگر اینکه با hasOwnProperty چک شود)
- ترتیب پیمایش تضمین‌شده‌ای ندارد (به خصوص در مرورگرهای مختلف)
توجه: استفاده از for...in برای آرایه‌ها توصیه نمی‌شود، زیرا ممکن است خصوصیات غیرعددی یا ارث‌بری‌شده را نیز شامل شود.
حلقه for...of چه مزایایی دارد؟
- مخصوص کار با مقادیر iterable مانند آرایه‌ها، رشته‌ها، Map و Set طراحی شده است
- فقط روی مقادیر (values) تکرار می‌کند، نه روی کلیدها یا خصوصیات
- ترتیب تکرار مطابق با ترتیب عناصر در ساختار داده است
- از پروتکل iterator استاندارد ES6 پیروی می‌کند
| مقایسه |
for...in |
for...of |
| نوع داده هدف |
اشیاء (Objects) |
iterableها (آرایه، رشته و...) |
| خروجی حلقه |
کلیدها (keys/properties) |
مقادیر (values) |
| پشتیبانی از prototype |
بله (مگر با hasOwnProperty محدود شود) |
خیر |
برای درک عمیق‌تر کاربرد حلقه for...of، می‌توانید مقاله بیشتر بخوانید را مطالعه کنید.
مثال‌های کاربردی
کد زیر تفاوت عملی این دو حلقه را نشان می‌دهد:
const arr = ['a', 'b', 'c'];
arr.test = 'property'; // اضافه کردن یک پراپرتی غیرعددی
// for...in (تمام کلیدهای قابل شمارش را نمایش می‌دهد)
for (let key in arr) { console.log(key); } // خروجی: 0, 1, 2, test
// for...of (فقط مقادیر عناصر iterable را نمایش می‌دهد)
for (let value of arr) { console.log(value); } // خروجی: a, b, c
همانطور که مشاهده می‌کنید، for...in حتی پراپرتی غیرعددی test را نیز نمایش می‌دهد، در حالی که for...of فقط روی مقادیر اصلی آرایه تکرار می‌کند.
