Q19. What is the difference between for...in and for...of loops?
key আর value কোনটাতে পাওয়া যায়, কখন কোন loop ব্যবহার করবেন।
দুটোই for লুপের আধুনিক ধরন, কিন্তু কাজ সম্পূর্ণ আলাদা। for...in object-এর key বা property নাম ঘুরে দেয়, আর for...of কোনো iterable (যেমন array, string, Set, Map) এর মান ঘুরে দেয়।
const user = { name: "Rahim", age: 25 };
// for...in — key পায়
for (const key in user) {
console.log(key); // "name", "age"
console.log(user[key]); // "Rahim", 25
}const colors = ["red", "green", "blue"];
// for...of — value পায়
for (const color of colors) {
console.log(color); // "red", "green", "blue"
}ধাপে ধাপে — for...in যখন চলে তখন ভেতরের variable-এ key-র নাম বসে, তাই সেটাকে obj[key] দিয়ে আবার খুঁজতে হয়। for...of-এ ভেতরের variable-এ সরাসরি মান বসে, তাই key বা index লাগলে entries() ব্যবহার করতে হয়।
// index-ও দরকার হলে
for (const [index, color] of colors.entries()) {
console.log(index, color); // 0 "red", 1 "green", 2 "blue"
}
// array-তে for...in চালালে key মানে index আসে
for (const i in colors) {
console.log(typeof i); // "string" — index-ও string!
}for...of শুধু যেসব জিনিস iterable সেগুলোর উপর চলে — array, string, Set, Map, generator। সাধারণ object এর উপর চালালে error পড়ে।
for (const x of { a: 1 }) {
// TypeError: obj is not iterable
}
// বদলে এভাবে লিখতে হয়
for (const key in { a: 1 }) {
console.log(key); // "a"
}| বিষয় | for...in | for...of |
|---|---|---|
| কী পায় | key / property নাম | মান (value) |
| মূল type | object | iterable |
| array-তে ফল | index (string) | element |
| inherited property | অন্তর্ভুক্ত হতে পারে | অন্তর্ভুক্ত হয় না |
| key লাগলে | সরাসরি পাওয়া যায় | entries() লাগে |
for...in prototype chain-এর property-ও ঘুরতে পারে, তাই পরিস্থিতি নিয়ন্ত্রণ না থাকলে unexpected বাগ হতে পারে। তাই শুধু নিজের object-এর key বোঝার জন্য for...in ব্যবহার করুন, array বা string-এর জন্য for...of বেশি নিরাপদ।