JavaScript

Object Properties

في هذا الدرس سوف نتعرف علي ال Object properties وهي تعتبر من اهم الاجزاء في ال objects حيث ان كل object هو في الاصل يتكون من مجموعة من ال properties 

التاريخ

09 نوفمبر 2021

الدروس

146

المستوى

العامة

اللغة

انجليزي

المشاهدات

1134

المواضيع

24
الشروحات chevron_left Object Properties chevron_left JavaScript

Object Properties

مراجعة تقنية
Mostafa Hefny

Mostafa Hefny

CEO & Founder CloseTag

</> Object Properties

- Properties هي القيم التي يتم اضافتها الي ال Object 

- اي object يتكون من مجموعة من ال properties وتكون في شكل مرتب او غير مرتب لان المسافات الفارغة يتم تجاهلها

-Properties يمكن تغيير قيمتها او حزفها او اضافتها الي ال object بشكل طبيعي لكن هناك بعض ال properties لا يمكن تغيير قمتها

</> Accessing JavaScript Properties

Syntax

يمكننا الوصول الي Properties عن طريق عدة طرق كالأتي

objectName.property      // person.age
Example
person.firstname + " is " + person.age + " years old.";
Syntax
objectName["property"]   // person["age"]
Example
person["firstname"] + " is " + person["age"] + " years old.";
objectName[expression]   // x = "age"; person[x]

</> JavaScript for...in Loop

يمكننا استخدام الدالة التكرارية " for in " لنستخدمها في المرور علي جميع عناصر الخاصة بال Object لتنفذ امر معين دون الحاجة الي تنفيذه علي كل عنصر منفردا 

ففي المثال التالي قمنا بأنشاء متغير " text " فارغ لا يحتوي علي اي قيمة 

وقمنا بعد ذلك بأنشاء حلقة تكرارية باستخدام for in تقوم بالمرور علي كل حرف من احرف المتغيرات التالية (fname  , lname , age ) ثم بعد ذلك تقوم بوضع هذه الاحرف بداخل المتغير التالي " txt "

Syntax
for (let variable in object) {
  // code to be executed
}
Example
const person = {
  fname:"Mohamed",
  lname:"saleh",
  age:25
};

</> Adding New Properties

يمكننا اضافة property جديدة الي object موجود بالفعل عن طريق 

كتابة اسم ال Object + " . " + القيمة الخاصة بالعنصر الذي قمت بأضافته الي هذا ال object 

- في المثال التالي نقوم بأضافة خاصية property تسمي "nationality " الي العنصر " person " وقمنا بتعيين قيمتها تساوي "English"

Example
person.nationality = "English";

</> Deleting Properties

يمكننا حذف property معينة من object معين عن طريق استخدام الكلمة delete ثم اسم ال object ثم اسم ال property ويجب ان يفصل بينهم بنقطة كما في المثال التالي

const person = {
  firstName: "ahmed",
  lastName: "Essa",
  age: 50,
  eyeColor: "blue"
};

delete person.age;

ويمكننا ايضا حذف property بهذا الشكل

const person = {
  firstName: "ahmed",
  lastName: "Essa",
  age: 50,
  eyeColor: "blue"
};

delete person["age"];

</> Nested Objects

يمكن ان يكون احد عناصر object معين هو عبارة عن object وهو ما يسمي بال Nested Object

myObj = {
  name:"ahmed",
  age:30,
  cars: {
    car1:"Ford",
    car2:"BMW",
    car3:"Fiat"
  }
}

يمكنك الوصول الي ال object عن طريق استخدام علامة النقطة " . "

myObj.cars.car2;

يمكنك الوصول الي ال object عن طريق استخدام الاقواس التالية " [ ] "

myObj.cars["car2"];
Example
myObj["cars"]["car2"];
Example
let p1 = "cars";
let p2 = "car2";
myObj[p1][p2];

</> Nested Arrays and Objects

يمكن ان يكون احد عناصر ال object هو عبارة عن array واحد عناصر هذا ال array هو عبارة عن object كما في المثال التالي

const myObj = {
  name: "Mohamed",
  age: 30,
  cars: [
    {name:"Ford", models:["Fiesta", "Focus", "Mustang"]},
    {name:"BMW", models:["320", "X3", "X5"]},
    {name:"Fiat", models:["500", "Panda"]}
  ]
}

نستخدم ال for in loop للتمكن من الوصول الي عناصر ال array والتي هي عبارة عن array ايضا كما في المثال التالي

for (let i in myObj.cars) {
  x += "<h1>" + myObj.cars[i].name + "</h1>";
  for (let j in myObj.cars[i].models) {
    x += myObj.cars[i].models[j];
  }
}

</> Property Attributes

  • يجب ان تحتوي جميع ال properties علي اسماء وقيم 
  • القيمة هي عبارة عن attribute من ال attributes الخاصة بال property's 
  • ال attributes تحدد نوع ال property ما اذا كانت يمكن التعديل عليها او لا 
  • في JavaScript ، يمكن قراءة جميع attributes، ولكن يمكن تغيير قيمة ال attributes  فقط (وفقط إذا كانت الخاصية قابلة للتعديل).
معلومات تهمك
  • لا تنس تقييم الدروس لكي نُحدّث المُحتوى باستمرار حتى ينال إعجابك.
  • لا تنس مشاركة الموقع مع أصدقائك حتى تعمّ الفائدة وتكون سببًا في نفعهم.
مشاركة
0
0
0
0
عدد المشاركات
هل هذه المعلومات نالت إعجابك ؟
0
0
عدد التقييمات