جلسه 7: اشیاء در جاوا اسکریپت

خواندن این مطلب 1 دقیقه زمان میبرد

این جلسه میپردازیم به اشیاء جاوا اسکریپت، اشیاء در جاوا اسکریپت همانند اشیائی هستند که در پیرامون ما وجود دارند. یعنی هر کدام می توانند خواص و ویژگی های خود را داشته باشند. بعنوان مثال خودرو, از خاصیت های یک خودرو میتوان مدل، نوع، رنگ و خیلی ویژگی های دیگر نام برد.

تعریف اشیاء همانند تعریف متغیرهاست که در جلسه های قبلی به خوبی به این مبحث پرداختیم، با این تفاوت که چند ویژگی درون خود جای میدهد. برای تعریف شیء کافیست از کلمه ی کلیدی “var” استفاده کنید.

نکته: ویژگی های درون اشیاء را با کاما(،) از همدیگر جدا می کنیم.

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

var car = {type:"Fiat", model:"500", color:"white"};

در مثال فوق یک شیء به نام “car” تعریف کرده ایم و سه ویژگی “type“, “model” و “color” درون آن قرار داده و مقدار دهی کرده ایم. خب تا اینجا تعریف و مقداردهی اشیاء را یاد گرفیتم، حالا چطور باید مقادیر فراخوانی و چاپ شوند؟!

ما به دو روش می توانیم اشیاء را فراخوانی و مقادیر آن ها را چاپ کنیم:

روش اول: کافیست همانند مثال زیر به ترتیب ابتدا نام شیء سپس نقطه”.” سپس خاصیتی که میخواهیم مقدار آن چاپ شود را بنویسیم.بدین صورت:

objectName.propertyName

در مثال زیر برای فراخوانی نوع ماشین به این صورت نوشته ایم: car.type

<!DOCTYPE html>
<html>
<body>

<h2>اشیاء در جاوا اسکریپت</h2>
<p id="demo"></p>

<script>
// ایجاد شیء
var car= {
    type: "Fiat",
    model: "500",
    color: "white"
};
// نمایش مقداری از خاصیت تعیین شده
document.getElementById("demo").innerHTML =
car.type;
</script>

</body>
</html>

روش دوم: در این روش کافیست به این ترتیب: نام شیء سپس [“نام خاصیت”] را بنویسیم. بدین صورت:

objectName[“propertyName”]

در مثال زیر برای فراخوانی مدل ماشین به این صورت نوشته ایم: [“car[“model

<!DOCTYPE html>
<html>
<body>

<h2>اشیاء در جاوا اسکریپت</h2>
<p id="demo"></p>

<script>
// ایجاد شیء
var car= {
    type: "Fiat",
    model: "500",
    color: "white"
};
// نمایش مقداری از خاصیت تعیین شده
document.getElementById("demo").innerHTML =
car["model"];
</script>

</body>
</html>

شما می تواند چند مثال را خودتان بنویسید تا ملکه ی ذهنتان شود امیدوارم که خسته نشده نباشید با ادامه آموزش جاوا اسکریپت با ما باشید.

جلسه بعد

جلسه قبل

3/5 - (1 امتیاز)

منبع

برچسب ها