تفاوت for…in و for…of در جاوااسکریپت: پیمایش داده‌ها در جاوااسکریپت
حلقه for در جاوا اسکریپت برای پیمایش داده‌ها استفاده می‌شود. (یعنی به ما کمک می‌کند تا داده‌ها را یکی یکی مرور کنیم.) زمانی هم که صحبت از پیمایش آرایه‌ها، اشیا یا سایر ساختارهای داده‌ای می‌شود، دو حلقه پرکاربرد وجود دارند: for…in و for…of. اگرچه این دو حلقه ظاهراً مشابه به نظر می‌رسند، اما تفاوت‌های زیادی دارند. در این مطلب تفاوت for in و for of از حلقه های تکرار در جاوا اسکریپت را به‌طور کامل بررسی خواهیم کرد.
حلقه for در جاوا اسکریپت: مقدمه‌ای بر تکرار داده‌ها
برنامه‌نویسان از انواع حلقه ها در جاوا اسکریپت برای پیمایش مجموعه داده‌ها استفاده می‌کنند. انواع حلقه for:
- for کلاسیک
- while و do…while
- forEach (ویژه آرایه‌ها)
- for…in
- for…of
برای این مطلب تمرکز ما روی for…in و for…of خواهد بود که هر دو برای حلقه‌های تکرار در جاوا اسکریپت به کار می‌روند. اما آیا می‌توان از هر دوی آن‌ها به‌جای یکدیگر استفاده کرد؟ بیایید بررسی کنیم.
For in در جاوا اسکریپت: پیمایش کلیدها
برای بررسی تفاوت for in و for of، بهتر است درک کنیم که for in چیکار می‌کند.
for…in برای پیمایش کلیدهای یک شی است و برای اشیای معمولی (Object) به کار می‌رود. این حلقه شامل کلیدهای قابل شمارش (enumerable properties) می‌شود. این موضوع حتی اگر آن‌ها از پروتوتایپ (Prototype) به ارث رسیده باشند نیز صدق می‌کند. بیاید با یک مثال این مفهوم را برای‌تان ساده‌تر کنیم.
مثالی از حلقه ی for در جاوا برای پیمایش یک شی:
let person = { name: “Ali”, age: 25, city: “Tehran” };
for (let key in person) {
console.log(key); // “name”, “age”, “city”
console.log(person[key]); // “Ali”, 25, “Tehran”
}
در نتیجه مثال بالا، for…in تمام کلیدهای شیء را دریافت کرده و مقادیر مربوطه را نمایش می‌دهد. در موارد پیچیده‌تر، توسعه‌دهندگان از حلقه های تو در تو در جاوا اسکریپت بهره می‌برند.
for…in روی آرایه‌ها: مراقب باشید!
اگر از for…in روی آرایه‌ها استفاده کنید، مقدار بازگشتی ایندکس‌های آرایه (به‌صورت رشته) خواهد بود. همچنین اگر ویژگی‌ای اضافه کرده باشید، آن نیز در خروجی نشان داده می‌شود.
let arr = [10, 20, 30];
arr.foo = “bar”; // افزودن یک ویژگی به آرایه
for (let index in arr) {
console.log(index); // “0”, “1”, “2”, “foo”
console.log(arr[index]); // 10, 20, 30, “bar”
}
اما مشکل این روش چیست؟ علاوه بر ایندکس‌های عددی، ویژگی‌های اضافه‌شده مانند “foo” هم نمایش داده می‌شوند، که در اغلب موارد رفتار ناخواسته‌ای است. به همین دلیل for…in برای پیمایش آرایه‌ها توصیه نمی‌شود.
for of در جاوا اسکریپت: پیمایش مقادیر
حلقه for…of برای ساختارهای تکرارپذیر (iterable objects) مثل آرایه‌ها، رشته‌ها، Map، Set و NodeList طراحی شده است. این حلقه برخلاف for…in، به‌جای کلیدها، مقادیر عناصر را پیمایش می‌کند.
با یک مثال ساده از پیمایش آرایه با for…of می‌توانید این دستور را بهتر درک کنید.
مثالی از for…of:
let numbers = [10, 20, 30];
for (let value of numbers) {
console.log(value); // 10, 20, 30
}
- نکته: این روش بهترین روش برای پیمایش داده‌ها در آرایه‌ها است.
فرق for و foreach: کدام بهتر است؟
درست است که forEach و for…of هر دو برای پیمایش آرایه‌ها استفاده می‌شوند، اما تفاوت‌هایی دارند. تفاوت های forEach و for…of عبارتند از:
| ویژگی | forEach | for…of |
|---|---|---|
| خوانایی کد | ساده و کاربردی | ساده و خوانا |
| امکان break | ندارد | دارد |
| امکان continue | ندارد | دارد |
| سرعت | سریع | سریع |
چه زمانی از for…in استفاده کنیم؟
for…in را در مواقعی به کار بگیرید که قصد پیمایش خصوصیات یک شیء را دارید. یا وقتی می‌خواهید بررسی کنید که یک شیء چه کلیدهایی دارد. علاوه بر این دو مورد، زمانی که در حال کار با یک شیء پویا هستید هم می‌توانید از for…in استفاده کنید.
- نکته مهم: هنگام استفاده از for…in برای اشیا، حتماً بررسی کنید که مقدار از پروتوتایپ نیامده باشد
چه زمانی از for…of استفاده کنیم؟
با بررسی تفاوت for in و for of به راحتی می‌توان متوجه شد، زمانی که قصد پیمایش مقادیر یک آرایه را دارید از for…of استفاده کنید. یا وقتی می‌خواهید یک رشته را کاراکتر به کاراکتر پردازش کنید، استفاده از for…of را پیشنهاد می‌کنیم.
یادگیری عمیق تفاوت for in و for of با آکادمی چابک!
درک تفاوت for in و for of به شما کمک می‌کند که در شرایط مختلف، انتخاب درستی داشته باشید.
حلقه for…in برای پیمایش کلیدهای یک شیء طراحی شده و می‌تواند هم خصوصیات خود شیء و هم ویژگی‌های به ارث برده از پروتوتایپ را نمایش دهد. اما استفاده از آن برای آرایه‌ها توصیه نمی‌شود!
در مقابل for…of مخصوص پیمایش مقادیر در ساختارهای تکرارپذیر مثل آرایه‌ها، رشته‌ها، Map، Set و … است. این حلقه برخلاف for…in، مستقیماً مقادیر را بازمی‌گرداند و خصوصیات اضافی یا ارثی را در خروجی نمایش نمی‌دهد.
اگر به دنیای برنامه‌نویسی، تکنولوژی و مهارت‌های فنی علاقه دارید، آکادمی چابک جایی است که می‌تواند شما را یک قدم جلوتر ببرد! ما با برگزاری دوره‌های تخصصی برنامه‌نویسی، کسب‌وکار و مهارت‌های فنی، به شما کمک می‌کنیم تا دانش خود را به سطح بالاتری برسانید. چه یک مبتدی باشید و چه یک متخصص، همین الان با ما تماس بگیرید.
منبع:
دیدگاهتان را بنویسید