آموزش جاوا اسکریپت – فصل سیزدهم: نوع داده Object

داده از نوع Object یا همان شیء مشابه سایر داده ها عمل می کند، با این تفاوت که متغیر ساخته شده از این نوع قادر است تا مقادیر متفاوتی را در قالب متود ها و صفت ها (property) در اختیار داشته باشد.

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

در زبان های برنامه نویسی مانند سی شارپ یا جاوا شما برای ساختن یک Object نیاز به یک کلاس دارید. در زبان جاوا اسکریپت این گونه نیست زیرا کلاسی به صورت پیش فرض در جاوا اسکریپت وجود ندارد. (برای ساخت یک کلاس با جاوا اسکریپت البته می توانید از فانکشن ها کمک بگیرید که در قسمت پیشرفته آموزش جاوا اسکریپت این موضوع را به طور کامل شرح خواهیم داد).

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

یک Object را در زبان جاوا اسکریپت به دو طریق می توان ساخت:

• شیء لیترال (Object Literal)
• استفاده از شیء ساز (Object Constructor)

تعریف یک Object به صورت لیترال (Object Literal)

تعریف یک Object به صورت Literal آسان ترین راه برای تعریف یک شیء است. با استفاده از {} می توانید یک شیء را به سرعت تعریف کنید.

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

در زیر نحوه تعریف یک شی را در زبان جاوا اسکریپت مشاهده می کنید:

var <object-name> = { key1: value1, key2: value2,... keyN: valueN};

مثال زیر نشان می دهد که چگونه می توانید در زبان جاوا اسکریپت یک Object لیترال تعریف کنید:

var emptyObject = {}; // object with no properties or methods

var person = { firstName: "John" }; // object with single property

// object with single method
var message = { 
                showMessage: function (val) { 
                            alert(val); 
                } 
            }; 

// object with properties & method
var person = { 
                firstName: "James", 
                lastName: "Bond", 
                age: 15, 
                getFullName: function () { 
                        return this.firstName + ' ' + this.lastName 
                }
            };

فصل 13 – مثال 1

توجه داشته باشید که حتما در هنگام انتساب صفت و متود به آبجکت، از کلید/مقدار استفاده کنید. قرار دادن یک متود درون یک آبجکت، بدون تعریف کلید، صحیح نیست.

به عنوان مثال سینتکس زیر صحیح نیست:

var person = { firstName };

var person = { firstName: };

فصل 13 – مثال 2 (مثال نادرست)

دسترسی به property ها و متدهای یک شی در جاوا اسکریپت

شما با استفاده از نقطه . و یا براکت [] می‌توانید به یک متد و یا property در یک Object دسترسی پیدا کنید، مقدار آن را بخوانید و یا آن را تغییر دهید.

در زیر مثالی از نحوه دسترسی به یک متود و یا property در یک شیء مشاهده می کنید:

var person = { 
                firstName: "James", 
                lastName: "Bond", 
                age: 25, 
                getFullName: function () { 
                    return this.firstName + ' ' + this.lastName 
                } 
            };

person.firstName; // returns James
person.lastName; // returns Bond

person["firstName"];// returns James
person["lastName"];// returns Bond

person.getFullName();

فصل 13 – مثال 3

نکته: در هنگام دسترسی به متد های یک شیء باید حتما از () در انتهای فانکشن استفاده کنید.

استفاده از سازنده Object برای ساخت یک Object در جاوا اسکریپت

روش دوم ساخت Object در جاوا اسکریپت استفاده از سازنده شیء ارائه شده توسط این زبان است.

استفاده از سازنده ی شیء در زبان جاوا اسکریپت با کلید واژه new انجام می پذیرد.

برنامه نویس می تواند با استفاده از نقطه صفت ها و یا متود ها را به شی ساخته شده نسبت دهد.

هم چنین برای تعریف یک صفت درون یک شیء قادر هستید از براکت [] استفاده کنید. در بین براکت باید نام صفت مورد نظر خود را در بین علامت نقل قول دوتایی یا تکی قرار دهید.

به مثال زیر توجه کنید:

var person = new Object();

// Attach properties and methods to person object     
person.firstName = "James";
person["lastName"] = "Bond"; 
person.age = 25;
person.getFullName = function () {
        return this.firstName + ' ' + this.lastName;
    };

// access properties & methods 
person.firstName; // James
person.lastName; // Bond
person.getFullName(); // James Bond

فصل 13 – مثال 4

متود ها و صفت های undefined در جاوا اسکریپت

منظور از متود یا صفت undefined، متود یا صفتی است که تعریف نشده باشد.

زبان جاوا اسکریپت در زمانی که تلاش می کنید به متود یا صفتی که وجود ندارد دسترسی پیدا کنید پاسخی برابر undefined برخواهد گرداند.

اگر مطمئن نیستید که Object دارای صفتی خاص است می‌توانید توانید قبل از استفاده از آن از فانکشن hasOwnProperty() استفاده کنید.

مانند مثال زیر:

var person = new Object();
    
person.firstName; // returns undefined

if(person.hasOwnProperty("firstName")){
           person.firstName;
    }

فصل 13 – مثال 5

دسترسی به کلیدهای درون یک Object

برای گرفتن لیستی از کلید های تعریف شده درون Object می توانید از حلقه for...in استفاده کنید. این حلقه برای دسترسی به مقادیر کاربردی ندارد و فقط کلید ها را دریافت می کند.

مانند مثال زیر:

var person = new Object();
    
person.firstName = "James";
person["lastName"] = "Bond";
person.age = 25;
person.getFullName = function () {
        return this.firstName + ' ' + this.lastName;
    };

for(var key in person){
        alert(key);
    };

فصل 13 – مثال 6

انتقال یک شیء از از یک فانکشن به فانکشن دیگر

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

در فانکشن مقصد حتی قادر هستید صفت های Object را نیز ست کنید.

مانند مثال زیر:

function changeFirstName(per)
{
    per.firstName = "Steve";
}

var person = { firstName : "Bill" };

changeFirstName(person)    

person.firstName; // returns Steve

فصل 13 – مثال 7

دقت کنید که هرگاه دو متغیر به یک شیء اشاره کنند با تغییر هر متغیر متغیر دوم نیز دچار تغییر خواهد شد.

به مثال زیر توجه کنید:

var person = { firstName : "John" };

var anotherPerson = person;  

anotherPerson.firstName = "Bill";

person.firstName; //returns Bill

فصل 13 – مثال 8

استفاده از یک شیء درون یک شیء دیگر

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

به مثال زیر توجه کنید:

var person = {
    firstName: "James",
    lastName: "Bond",
    age: 25,
    address: {
        id: 1,
        country:"UK"
    }
};

person.address.country; // returns "UK"

فصل 13 – مثال 9

در مثال بالا شی address درون شی person قرار گرفته است.