Java Script Object vs Array
الكائنات والمصفوفات في لغة جافا سكريبت
ستتعلم في هذا الدرس ما هو الفرق بين الكائنات والمصفوفات في لغة جافا سكريبت Java Script Object vs Array وكيفة تحويل الكائن الي مصفوفة Convert Object To Array وكيف يمكن تحويل المصفوفه الي كائن Convert Array to Object
التاريخ
الدروس
المستوى
اللغة
المشاهدات
المواضيع
الشروحات chevron_left Java Script Object vs Array chevron_left JavaScript
Array VS Object
الكائنات والمصفوفات في لغة جافا سكريبت
</>
Variables VS Arrays VS Objects
المتغيرات و المصفوفات والكائنات في الجافاسكريبت
var plane = "MS"; document.write(plane);
var plane = ['MS',2001,"2250kg","white"]; document.write(plane);
var plane = {name : "MS",model : 2001,weight : "2250kg",color : "White"}; document.write(plane.name,"<br>"); document.write(plane.model);
</>
Arrays vs Objects
الفرق بين المصفوفة والكائنات في الجافاسكريبت
- المصفوفة JavaScipt Array هي نوع خاص من انواع ال Object ,
- توجد دالة مدمجة Built-in Function في لغة ال JavaScript وهي typeof وظيفتها ان ترجع لك نوع المتغير الذي نضعة بداخلها , فاذا قمنا بكتابة متغير ال array بداخلها سوف تقوم بأرجاع النوع object يعني ذلك ان المصفوفة array هي في الاصل عبارة عن Object
- جرب هذا المثال لكي تتضح الصورة كاملة
var courses = ["HTML", "CSS", "JS"]; courses [0] = "PHP"; document.write(typeof(courses));
الفرق بين ال الكائن Object وبين المصفوفة Array :
- ال Object نقوم بطباعة اسم الكائن ثم بعد علامة النقطة ثم بعد ذلك المفتاح او ما يسمي ب "key" .
- ال Array نقوم بطباعة اسم المصفوفة ثم بعد ذلك الأقواس المربعة [ ] للوصول إلي القيمة المطلوبة عن طريق index number .
طباعة او استخدام واحد من القيم المحزنة بداخل ال array
var courses = ["HTML", "CSS", "JS"]; document.write("<b>"+ courses[0] +"<b>");
طباعة او استخدام واحد من القيم المخزنة بداخل ال object
var car = {type:"MS", model:"2001", color:"white"}; document.write("<b>"+ car.model +"<b>");
</>
Array Elements Can Be Objects
المصفوفة تكون كائن في الجافاسكريبت
- يمكن أن يكون لديك كائنات في المصفوفة array
- يمكن أن يكون لديك دوال functions في المصفوفة array
- يمكن أن يكون لديك مصفوفة array في المصفوفة array
myArray[0] = Date.now; /* this is an object */ myArray[1] = myFunction; /* this is a function */ myArray[2] = myCars; /* this is an array */
var factory = [ 'cars', { "model":"2001", "color": "red", }, 'Motorcycle' ] ; console.log(factory);
</>
Convert Object to array
تحويل الكائن الي مصفوفة في الجافاسكريبت
نستطيع تحويل الكائن object الي مصفوفة array باستخدام عدة دوال مختلفة وهم :
- ( )Object.values
- ( )Object.keys
- ( )Object.entries
باستخدام ( )Object.values
var plane= { type:"MS", model:2001, color:"white" } var propertyValues=Object.values(plane); document.write(propertyValues);
باستخدام دالة ( )Object.keys
var plane= { type:"MS", model:2001, color:"white" } var propertyValues=Object.keys(plane); document.write(propertyValues);
باستخدام دالة ( )Object.entries
var plane= { type:"MS", model:2001, color:"white" } var propertyValues=Object.entries(plane); document.write(propertyValues);
</>
Convert array to object
تحويل المصفوفة الي كائن
يمكننا تحويل المصفوفة array الي كائن object باستخدام طريقتين مختلفتين وهم
- الطريقة الأولي باستخدام الspread Operator { ... } وهي عن طريق انشاء كائن object ثم اضافة اسم المصفوفة التي تريد تحويلها الي كائن مسبوقة بثلاثة نقاط " . . . " وبهذه الطريقة نكون قد أنشأنا كائن جديد يحتوي علي جميع عناصر المصفوفة
- الطريقة الثانية باستخدام دالة ( )Object.assign ونقوم بتمرير اليها قيمتين القيمة الاولي تكون أقواس متعرجة curly brackets { } والقيمة الثانية تكون أسم الكائن object
باستخدام spread operator
var courses = ["HTML", "CSS", "JS"]; var obj = {...courses}; console.log(obj);
باستخدام دالة ( )Object.assign
var courses = ["HTML", "CSS", "JS"]; var obj = Object.assign({},courses); console.log(obj);