آموزش جامع آبجکت‌ها در جاوااسکریپت؛ ساختاردهی حرفه‌ای به داده‌ها

اگر آرایه‌ها برای نگه‌داشتن لیستی از داده‌های مشابه مناسب هستند، آبجکت‌ها برای توصیف یک موجودیت با ویژگی‌های مختلف به کار می‌روند. برای مثال یک کاربر، نام، سن، ایمیل و وضعیت فعالیت دارد؛ همه این اطلاعات را می‌توان در قالب یک آبجکت به‌صورت منظم ذخیره کرد. آبجکت‌ها اساس کار با داده‌ها در جاوااسکریپت و فرمت محبوب JSON هستند.

ساخت آبجکت

آبجکت با جفت آکولاد { } ساخته می‌شود و هر ویژگی آن از یک کلید (Key) و یک مقدار (Value) تشکیل شده است:

const user = {
    firstName: "نگار",
    lastName: "محمدی",
    age: 27,
    email: "negar@example.com",
    isActive: true
};

دسترسی به ویژگی‌ها

برای دسترسی به مقدار هر ویژگی دو روش وجود دارد: روش نقطه که رایج‌تر است و روش براکت که برای کلیدهای پویا یا کلیدهایی با کاراکتر خاص کاربرد دارد:

console.log(user.firstName);      // نگار
console.log(user.age);            // 27

const key = "email";
console.log(user[key]);           // دسترسی پویا با براکت

// افزودن ویژگی جدید یا ویرایش ویژگی قبلی
user.city = "تبریز";
user.age = 28;

متدها در آبجکت

آبجکت‌ها فقط برای ذخیره داده نیستند؛ می‌توانند رفتار هم داشته باشند. وقتی یک تابع داخل آبجکت تعریف می‌شود به آن متد می‌گوییم. کلمه کلیدی this به خود آبجکت اشاره دارد:

const person = {
    firstName: "حسین",
    lastName: "کریمی",
    fullName: function() {
        return this.firstName + " " + this.lastName;
    }
};

console.log(person.fullName());   // حسین کریمی

محصول اورجینال INZIP

قالب وردپرس باریستا مخصوص کافه تم نسکافه ای روشن (دو زبانه)

دانلود پوسته وردپرس باریستا؛ قالب کافیشاپ، رُستری قهوه و فروشگاه قهوه دوزبانه با منوی رومیزی، رزرو آنلاین میز با کد پیامکی و ووکامرس. طراحی اختصاصی inzip.ir

تحویل آنی آپدیت رایگان بدون قفل لایسنس پشتیبانی واقعی

۳,۹۹۰,۰۰۰ تومان ۲,۹۶۰,۰۰۰ تومان

بازدید و دانلود آنی

٪۲۶

تخفیف ویژه

سود شما

۱,۰۳۰,۰۰۰ تومان

پیمایش آبجکت

متدهای Object.keys، Object.values و Object.entries به ترتیب کلیدها، مقادیر و جفت‌های کلید-مقدار آبجکت را به‌صورت آرایه برمی‌گردانند و پیمایش آبجکت را بسیار ساده می‌کنند:

const product = {
    title: "لپ‌تاپ",
    price: 25000000,
    stock: 12
};

console.log(Object.keys(product));    // آرایه‌ای از کلیدها
console.log(Object.values(product));  // آرایه‌ای از مقادیر

Object.entries(product).forEach(([key, value]) => {
    console.log(key + ": " + value);
});

استخراج مقادیر با Destructuring

Destructuring روشی مدرن برای استخراج مقادیر آبجکت در متغیرهای جداگانه است که کد را کوتاه‌تر و خواناتر می‌کند:

const { title, price } = product;

console.log(title);   // لپ‌تاپ
console.log(price);   // 25000000

کپی کردن آبجکت‌ها

نکته بسیار مهم این است که آبجکت‌ها با مرجع (Reference) کپی می‌شوند، یعنی انتساب مستقیم آن‌ها به یک متغیر دیگر، کپی مستقلی ایجاد نمی‌کند و تغییر یکی روی دیگری هم اثر می‌گذارد. برای ساخت کپی واقعی از عملگر Spread استفاده کنید:

const copyProduct = { ...product };
copyProduct.price = 24000000;

console.log(product.price);       // 25000000 و بدون تغییر
console.log(copyProduct.price);   // 24000000

جمع‌بندی

آبجکت‌ها قلب تپنده جاوااسکریپت هستند و تقریباً در تمام پروژه‌های واقعی با آن‌ها سروکار خواهید داشت؛ از ذخیره اطلاعات کاربر گرفته تا دریافت پاسخ از APIها. تسلط بر آبجکت‌ها، درک مفاهیم پیشرفته‌تر مانند کلاس‌ها و برنامه‌نویسی شی‌گرا را نیز بسیار آسان می‌کند.