اشیا در جاوا اسکریپت

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


اشیا در جهان واقعی

در جهان واقعی یک اتومبیل یک object محسوب می شود. یک اتومبیل دارای مشخصه های وزن و رنگ است، که در جاوا اسکریپت با نام properties شناخته می‌شود. یک شی در جاوا اسکریپت همچنین می‌تواند شامل method ها نیز باشد. یک method بیانگر عملکرد و رفتار آن شی است. در مورد اتومبیل method ها می توانند عمل روشن کردن، به جلو رفتن و توقف کردن را برای آن پیاده سازی کنند.

propertiy های یک اتومبیل در جاوا اسکریپت :

  • car.name = Fiat
  • car.model = 500
  • car.weight = 850kg
  • car.color = white

method های یک اتومبیل در جاوا اسکریپت :

  • ()car.start
  • ()car.drive
  • ()car.brake 
  • ()car.stop

همه ی اتومبیل ها property های یکسانی دارند، اما مقادیر این property ها در اتومبیل های مختلف، متفاوت است.

همه اتومبیلها method های یکسانی دارند، اما method های آنها در زمان های مختلفی عمل می کنند.


اشیای جاوا اسکریپت

در فصل های قبل آموختید که متغیرها در جاوا اسکریپ همچون ظرف هایی هستند که می توان داده ها را در آنها نگهداری کرد. نمونه مثال زیر یک مقدار ساده (Fiat) را به متغیری به نام car انتساب داده  است :

<p id="demo"></p>

<script>
// Create and display a variable:
var car = "Fiat";
document.getElementById("demo").innerHTML = car;
</script>

خروجی :

Fiat


اشیا هم نوعی متغیر محسوب می‌شوند با این تفاوت که میتوانند چندین مقدار را در خود جای دهند. در نمونه مثال زیر چندین مقدار به متغیری به نام car انتساب داده شده است :

<p id="demo"></p>

<script>
// Create an object:
var car = {type:"Fiat", model:"500", color:"white"};

// Display some data from the object:
document.getElementById("demo").innerHTML = "The car type is " + car.type;
</script>

خروجی :

The car type is Fiat

مقادیر در نمونه مثال بالا به صورت name:value انتساب داده شده‌اند.


تعریف اشیا

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

<p id="demo"></p>

<script>
// Create an object:
var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};

// Display some data from the object:
document.getElementById("demo").innerHTML =
person.firstName + " is " + person.age + " years old.";
</script>

خروجی :

John is 50 years old.

فضاهای خالی بین مقادیر مهم نیستند. به همین دلیل می‌توان برای خوانایی بیشتر، کد بالا را در چندین خط به شکل زیر نوشت :

<p id="demo"></p>

<script>
// Create an object:
var person = {
    firstName : "John",
    lastName  : "Doe",
    age       : 50,
    eyeColor  : "blue"
};

// Display some data from the object:
document.getElementById("demo").innerHTML =
person.firstName + " is " + person.age + " years old.";
</script>

دسترسی به Property های اشیا

میتوان به دو روش به Property های اشیا دسترسی داشت. در زیر قاعده نوشتاری دسترسی به Property ها آمده است :

objectName.propertyName

و یا :

objectName["propertyName"]

در نمونه مثال های زیر می توانید دسترسی به یک Property از یک شی را به شکل ملموس تری مشاهده کنید. روش اول :

<p id="demo"></p>

<script>
// Create an object:
var person = {
    firstName: "John",
    lastName : "Doe",
    id       :  5566
};
// Display some data from the object:
document.getElementById("demo").innerHTML =
person.firstName + " " + person.lastName;
</script>

و روش دوم :

<p id="demo"></p>

<script>
// Create an object:
var person = {
    firstName: "John",
    lastName : "Doe",
    id       :  5566
};
// Display some data from the object:
document.getElementById("demo").innerHTML =
person["firstName"] + " " + person["lastName"];
</script>

خروجی نمونه مثال های بالا به شکل زیر است :

John Doe

متدهای اشیا

اشیا در جاوا اسکریپت می‌توانند شامل method ها نیز باشند. method ها عملیاتی هستند که می‌توانند بر روی اشیا انجام شوند. method در اشیا به عنوان یک Property ذخیره می‌شوند. در نمونه مثال زیر fullName به عنوان یک method برای شی person در نظر گرفته شده است :

var person = {
    firstName: "John",
    lastName : "Doe",
    id       : 5566,
    fullName : function() {
        return this.firstName + " " + this.lastName;
    }
};

کلمه کلیدی this

در تعریف یک method کلمه کلیدی this اشاره به مالک آن method دارد. در نمونه مثال بالا شی person مالک تابع fullName است.


دسترسی به متدهای اشیا

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

objectName.methodName()
<p id="demo"></p>

<script>
// Create an object:
var person = {
    firstName: "John",
    lastName : "Doe",
    id       : 5566,
    fullName : function() {
       return this.firstName + " " + this.lastName;
    }
};
// Display data from the object:
document.getElementById("demo").innerHTML = person.fullName();
</script>

خروجی نمونه مثال بالا به شکل زیر است :

John Doe

اگر به متدی بدون پرانتز دسترسی پیدا کنید، تعریف متد برخواهد گشت :

<p id="demo"></p>

<script>
// Create an object:
var person = {
    firstName: "John",
    lastName : "Doe",
    id       : 5566,
    fullName : function() {
       return this.firstName + " " + this.lastName;
    }
};

// Display data from the object:
document.getElementById("demo").innerHTML = person.fullName;
</script>

خروجی نمونه مثال بالا به شکل زیر است :

function() { return this.firstName + " " + this.lastName; }

 

منتشر شده در ۸ آذر ۱۳۹۷ حمید رضا ملکی ۲۵۱۲ بازدید
دیدگاه ها

هنوز دیدگاهی ثبت نشده

برای ارسال دیدگاه لازم است ابتدا وارد سایت شوید