پیمایش آبجکت‌ها با حلقه for...in | آموزش جاوااسکریپت به زبان ساده

درود دوستان. گاهی اوقات می‌خوایم با یک حلقه روی پراپرتی‌های یک آبجکت پیمایش انجام بدیم و به اونها دسترسی داشته باشیم. توی جاوااسکریپت یک حلقه اختصاصی برای این کار وجود داره به اسم for...in.

توی این قسمت موارد زیر رو یاد می‌گیریم:

• حلقه for...in چیه
• حلقه for...in و آرایه‌ها

حلقه for...in چیه؟

با استفاده از حلقه for...in می‌تونیم روی پراپرتی‌های یک آبجکت حلقه بزنیم و به اونها دسترسی داشته باشیم. ساختار این حلقه به این صورت هست:

<<for>> (variable <<in>> object) {
  // body
}

چیزی که بعد از کلمه‌کلیدی in قرار می‌گیره آبجکت مد نظر ما هست. حلقه for...in روی پراپرتی‌های این آبجکت حلقه می‌زنه و توی هر پیمایش، اسم پراپرتی رو می‌ریزه توی متغیری که قبل از کلمه‌کلیدی in قرار گرفته.

مثال زیر رو در نظر بگیرین:

const user = {
  name: 'Emily',
  lastname: 'Emilyee',
  age: 4,
}

for (const prop in user) {
  alert(prop);
}

توی این مثال می‌خواستیم روی پراپرتی‌های آبجکت user حلقه بزنیم. prop یک اسم دلخواه هست برای متغیری که توی هر پیمایش ساخته میشه و مقدار اون پراپرتی‌ای هست که داره پیمایش روی اون انجام می‌گیره.

اگه بخوایم از این طریق به مقدار پراپرتی‌ها دسترسی داشته باشیم از کد زیر استفاده می‌کنیم:

const user = {
  name: 'Emily',
  lastname: 'Emilyee',
  age: 4,
}

for (const prop in user) {
  alert(<<user[prop]>>);
}

حلقه for...in و آرایه‌ها

این حلقه می‌تونه برای آرایه‌ها هم استفاده بشه. در این شرایط به ایندکس آرایه دسترسی داریم:

const alpha = ["a", "b", "c"];

for (const index in alpha) {
  alert(index);
}

اما استفاده از این حلقه برای آرایه‌ها پیشنهاد نمیشه. به این دلیل که این حلقه ضمانت نمی‌کنه که با حفظ ترتیب پیمایش‌ها رو انجام بده. برای پیمایش روی ایندکس‌های آرایه می‌تونیم از حلقه forEach استفاده کنیم:

const alpha = ["a", "b", "c"];

alpha.forEach((item, <<index>>) => {
  alert(index);
});

const obj1 = { a: 1 }
const obj2 = { b: 1 }

Object.setPrototypeOf(obj1, obj2);

for (const key in obj1) {
  alert(key); // a, b
}

خب دوستان دیدیم که چطوری با حلقه for...in می‌تونیم روی پراپرتی‌های یک آبجکت پیمایش بزنیم و به اونها دسترسی داشته باشیم. برای ادامه آموزش به قسمت‌های بعدی برید. روزتون خوش 😉✌️