Object Definition
في هذا الدرس سوف نتعرف علي Objects في لغة java Script وهو يعتبر من اهم المكونات للغة الجافاسكريبت
التاريخ
الدروس
المستوى
اللغة
المشاهدات
المواضيع
الشروحات chevron_left Object Definition chevron_left JavaScript
Object Definition
</> Object Definition
في JavaScript ، معظم الأشياء عبارة عن objects كائنات ، من ميزات JavaScript الأساسية مثل المصفوفات إلى واجهات برمجة تطبيقات المتصفح API المبنية في أعلى JavaScript. يمكنك أيضًا إنشاء كائنات خاصة بك لوضع الدوال والمتغيرات ذات الصلة داخلها كمجموعات فعالة وتعمل كحاويات بيانات . تعد طبيعة JavaScript القائمة على objects الكائن مهمة لفهم ما إذا كنت تريد الاستمرار في معرفتك باللغة ،
- يمكن اعتبار كل مكون او عنصر من عناصر ك Object
- قبل البدء في هذه الوحدة ، يجب أن يكون لديك بعض المعرفة بـ HTML و CSS.
- Booleans يمكن ان تكون Object اذا تم الحاقها بكلمة new عند تعريفها
- Numbers يمكن ان تكون Object اذا تم الحاقها بكلمة new عند تعريفها
- Strings يمكن ان تكون Object اذا تم الحاقها بكلمة new عند تعريفها
- تعتبر التواريخ أيضا عبارة عن object
- تعتبر العمليات الرياضية Maths عبارة عن Object
- Regular Expressions هي ايضا عبارة عن Object
- arrays تعتبر ايضا objects
- functions تعتبر ايضا objects
- تعتبر جميع عناصر لغة الجافاسكريبت عبارة عن objects ما عدا ال primitives
</> Objects are Variables
يمكن ان تحتوي المتغيرات في لغة الجافاسكريب علي قيمة واحده فقط
let person = "Mohamed saleh";
يمكن ايضا تخزين اكثر من قيمة بداخل المتغيرات وفي هذه الحالة تسمي ب Objects وتتكون عناصر ال Object من قيمتين وهما (name : value )
let person = { firstName : "Mohamed", lastName : "saleh", age : 25, eyeColor : "blue" };
من الشائع استخدام كلمة const قبل اسم ال object وهي تستخدم في تحديد عدم امكانية تغيير القيم الخاصة بهذا ال object
let person = { firstName : "Mohamed", lastName : "saleh", age : 25, eyeColor : "blue" };
</> Object Properties
تسمي القيم التي لها اسم مميز في ال Objects ب Properties
Property | Value |
firstName | Mohamed |
lastName | saleh |
age | 25 |
eyeColor | blue |
طريقة كتابة ال Objects عن طريق الزوج الذي يتكون من اسم العنصر والقيمة الخاصة به مشابه الي حد كبير ل
- Associative arrays في لغة PHP
- Dictionaries في لغة Python
- Hash tables في لغة C
- Hash maps في لغة Java
- Hashes في لغة Ruby و Perl
</> Object Methods
Methods هي الأفعال التي يتم تنفيذها علي ال Objects
ال Object properties يمكن ان تكون primitive values او objects او functions
Property | Value |
firstName | Mohamed |
lastName | saleh |
age | 25 |
eyeColor | blue |
fullName | function() {return this.firstName + " " + this.lastName;} |
Objects في لغة الجافاسكريبت هي عبارة عن حاوية تضم مجموعة من العناصر ممثله علي شكل عناصر تتكون من اسم العنصر والقيمة
</> Creating a JavaScript Object
يمكننا باستخدام لغة جافاسكريبت انشاء ال objects بكل سهوله باستخدام عدة طرق وهم
- object literal
- كلمة new
- انشاء object constructor وبعد ذلك انشاء objects منه
- باستخدام "object.create( ) "
</> Using an Object Literal
تعتبر هذه اسهل طريقة لانشاء ال objects في لغة java script وخلالها نقوم بأنشاء العنصر وتعريفه في جمله واحده
- خلاله نقوم بأضافة العناصر في شكل زوج يتكون من الاسم والقيمة الخاصة بكل عنصر ويتم الفصل بين كل عنصر بعلامة " . " ويتم وضع هذه العناصر بداخل اقواس متعرجة curly brackets
Example
const person = {firstName:"Mahmoud", lastName:"adel", age:50,eyeColor:"blue"};
عند انشاء العناصر الخاصة ب object معين فأن المسافات الزائدة والاسطر الفارغة يتم تجاهلها ولا تؤثر علي شئ
const person = { firstName: "Mahamoud", lastName: "Adel", age: 50, eyeColor: "blue" };
في هذا المثال نقوم بأنشاء object فارغ ثم بعد ذلك نقوم بأضافة العناصر اليه
const person = {}; person.firstName = "ahmed"; person.lastName = "hossam"; person.age = 50; person.eyeColor = "blue";
</> Using the JavaScript Keyword new
نستطيع انشاء objects في لغة الجافا سكريبت عن طريق استخدام الدالة ( )object مع الكلمة new كما في المثال التالي
Example
const person =new Object(); person.firstName = "ahmed"; person.lastName = "hossam"; person.age = 50; person.eyeColor = "blue";
</> JavaScript Objects are Mutable
ال Objects هي من النوع Mutable اي انها يمكن تغيير قيمتها ويتم الوصول اليها عن طريق العنوان الخاص بها وليس القيمة
const x = person; // Will not create a copy of person.
ال object التالي "X" لا يمثل نسخة من ال object التالي "person " وانما كليهما نفس العنصر أي انه أي تغيير يحدث في احد العنصرين سوف يؤثر علي الاخر بنفس قيمة هذا التغيير
const person = { firstName:"Ahmed ", lastName:"adel", age:50, eyeColor:"blue" } const x = person; x.age = 10; // Will change both x.age and person.age