اشیاء JS

اشیاء در جاوا اسکریپت مجموعه‌ای نامنظم (بدون ترتیب) از جفت کلید: مقدار (key: value) است.

const student = {
    name: "Ehsan",
    family: "Eslami",
    age: 31,
    fullName: function () {
        return `${this.name} ${this.family}`;
    }
};

نکته: اشیا مانند آرایه ها هستند با این تفاوت که ایندکس غیرعددی دارند. 

هر شیء دارای ویژگی ها (properties) و متد‌ها (methods) است.

ویژگی ها مانند متغیر، داده‌ها را ذخیره می‌کنند.

name: "Ehsan"

متدها مانند تابع، عملیات‌هایی را روی داده ها انجام می دهند. در نمونه کد زیر متد fullName یک تابع است که عملیات چسباندن name و family را انجام داده است.

fullName: function () {
    return `${this.name} ${this.family}`;
}

 ویژگی ها بدون پرانتز فراخوانی می شوند. متدها با پرانتز فراخوانی می شوند.

// فراخوانی ویژگی بدون پرانتز
student.name;
student['name']; // فراخوانی مانند آرایه

// فراخوانی متد با پرانتز
student.fullName();
student['fullName'](); // فراخوانی مانند آرایه

با سه روش میتوان اشیاء را تعریف کرد.

• استفاده از علامت شیء
• استفاده از کلمه کلیدی new
• استفاده از تابع سازنده اشیاء

نکته: مانند آرایه ها معمولا از کلمه کلیدی const برای ایجاد اشیاء استفاده می شود.

1- علامت شیء

با استفاده از براکت مجعد {} و جفت نام: مقدار (name: value) می توان شیء ساخت.

نکته: جفت نام: مقدار (name: value) همچنین کلید: مقدار (key: value) نامیده می‌شود.

const student = {name: "Ehsan", family: "Eslami", age: 31};

فاصله ها در ایجاد شیء تاثیری ندارند. برای خوانایی بیشتر می توان هر ویژگی یا متد را در یک خط نوشت.

const student = {
    name: "Ehsan",
    family: "Eslami",
    age: 30,
    fullName: function () {
        return `${this.name} ${this.family}`;
    }
};

حتی می توانیم یک شیء خالی ایجاد و سپس به آن ویژگی و متد اضافه کنیم.

// ایجاد یک شیء خالی
const student = {};

// اضافه کردن ویژگی ها
student.name = "Ehsan";
student.family = "Eslami";
student.age = 30;
// اضافه کردن متد
student.fullName = function () {
    return `${this.name} ${this.family}`;
}

2- استفاده از کلمه کلیدی new

با استفاده از کلمه کلیدی new می توان یک شیء جدید ایجاد و مقادیر مورد نظر را به آن اضافه کرد.

// ایجاد یک شی
const student = new Object();

// اضافه کردن ویژگی ها
person.name = "Ehsan";
person.family = "Eslami";
person.age = 31;
// اضافه کردن متد
student.fullName =  function () {
    return `${this.name} ${this.family}`;
}

نکته: به این دلیل که استفاده از شیء با کلمه کلیدی new باعث کاهش سرعت اجرا و خوانایی می شود، توصیه می شود به هیچ وجه استفاده نشود.

3- استفاده از تابع سازنده اشیاء

با استفاده از تابع سازنده نیز می توان شیء ساخت. از تابع سازنده زمانی استفاده می شود که بخواهیم تعداد زیادی شیء در یک قالب ایجاد کنیم.

function Student (name, family, age) {
    this.name = name;
    this.family = family;
    this.age = age;
    this.fullName = function () {
        return `${this.name} ${this.family}`;
    }
}

// ایجاد شیء student
const stu1 = new Student("name", "family", 30);

نکته: برای اطلاعات بیشتر به آموزش تابع سازنده اشیاء در JS مراجعه کنید.

ویژگی یا property مانند متغیر مقادیر را در خود ذخیره می کند.

const student = {
    name: "Ehsan",
    family: "Eslami",
    age: 31
};

برای دسترسی به ویژگی های شیء می‌توان از دو روش استفاده کرد:

• نقطه بعلاوه نام ویژگی 

student.name;

• نام ویژگی در داخل براکت مانند آرایه

student["name"];

در شیء JS متدها، تابع هستند. متدها مانند ویژگی شیء تعریف می شوند و می توانند عملیاتی را روی ویژگی های دیگر آن شیء انجام دهند.

const student = {
    name: "Ehsan",
    family: "Eslami",
    age: 31,
    fullName: function () {
        return `${this.name} ${this.family}`;
    },
};

نکته: در متد های شیء کلمه this به همان شیء ارجاع می شود.

برای اجرای متدهای شیء می‌توان از دو روش استفاده کرد:

• نقطه بعلاوه نام متد بعلاوه پرانتز (مانند اجرای تابع) 

student.fullName();

• نام متد در داخل براکت بعلاوه پرانتز

student["fullName"]();

برای حذف کردن ویژگی و متد شیء می توان از کلمه کلیدی delete استفاده کرد.

const student = {
    name: "Ehsan",
    family: "Eslami",
    age: 31,
    fullName: function () {
        return `${this.name} ${this.family}`;
    }
};

// ویژگی سن را حذف کردیم 
delete student.age;

const student = {
    name: "Ehsan",
    family: "Eslami",
    age: 31,
    fullName: function () {
        return `${this.name} ${this.family}`;
    }
};

// متد نام کامل را حذف کردیم
// برای حذف متد، متد را بدون پرانتز می نویسیم
delete person.fullName;

نکته: برای حذف متد، باید نام متد را بدون پرانتز بنویسیم

اشیاء می توانند، اشیاء و آرایه ها را به صورت تو در تو (nested) ذخیره کنند.

برای دسترسی به آرایه و شیء های داخلی، می توان از ایندکس و مقدار آن به صورت تودرتو استفاده کرد.

برای درک بهتر به نمونه کد زیر توجه کنید.

می توان مقادیر یک شیء را در اشیاء دیگری قرار داد.

students = [
    {
        name: "Ehsan",
        family: "Eslami",
        age: 31,
        classTime: {
            class1: "Tuesday",
            class2: "Friday"
        }
    }, {
        name: "Farzad",
        family: "Hadavand",
        age: 32,
        classTime: {
            class1: "Wednesday",
            class2: "Friday",
            class3: "Sunday"
        }
    }, 
]

students[1].family;    // Hadavand
students[1]['family']; // Hadavand

students[0].classTime.class2;        // Friday
students[0]['classTime']['class2'];  // Friday