Java Script Array Methods
دوال المصفوفات في لغة الجافا سكريبت
ستتعلم في هذا الدرس بعض الدوال الغير التي تستخدم مع المصفوفات Java Script Array Methods هذه الدوال تساعدك علي التعديل او ارجاع بيانات هامه من المصفوفات او الاضافة علي المصفوفات بلغة جافا سكريبت.
التاريخ
الدروس
المستوى
اللغة
المشاهدات
المواضيع
الشروحات chevron_left Java Script Array Methods chevron_left JavaScript
Java Script Array Methods
دوال المصفوفة في لغة الجافا سكريبت
</>
copyWithin() method
دالة ()copyWithin
تقوم دالة ()copyWithin بنسخ جزء من عناصر المصفوفة الي موقع اخر وإعادته دون تعديل طوله length.
قمنا بنسخ العنصر رقم 3 index الي العنصر رقم index 0 استبدلنا حرف a بحرف d
let letters = ['a', 'b', 'c', 'd', 'e'];
document.write("<b>" + letters.copyWithin(0, 3, 4) + "</b>");
/*
old Elements = ['a', 'b', 'c', 'd', 'e']
copy to index 0 the element at index 3
*/
قمنا بنسخ العنصر رقم 2 index الي العنصر رقم index 1 استبدلنا حرف CSS ب JavaScript
let courses = ['HTML', 'CSS', 'JavaScript', 'PHP', 'MYSQL'];
document.write("<b>" + courses.copyWithin(1, 2, 3) + "</b>");
/*
old Elements = ['HTML', 'CSS', 'JavaScript', 'PHP', 'MYSQL']
copy to index 1 the element at index 2
*/
قمنا بنسخ العنصر رقم 1 index الي العنصر رقم index 0 استبدلنا HTML ب css وبدأ صف العناصر علي حسب array length
let courses = ['HTML', 'CSS', 'JavaScript', 'PHP', 'MYSQL'];
document.write("<b>" + courses.copyWithin(0, 1) + "</b>");
/*
old Elements = ['HTML', 'CSS', 'JavaScript', 'PHP', 'MYSQL']
copy to index 0 the element at index 1
*/
كيف تعمل دالة copyWithin() method Syntax؟
copyWithin(target); copyWithin(target, start); copyWithin(target, start, end);
معطيات او عوامل (متغيرات) Parameters دالة ()copyWithin :
تأخذ دالة ()copyWithin ثلاث عوامل او ثلاث قيم وهم :
- Target رقم العنصر index number الذي سوف يتغير لقيمه اخري من قيم المصفوفة.
- Start اختياري (optional) رقم العنصر index number الذي سوف نبدأ نسخ منه.
- end اختياري (optional) رقم العنصر index number الذي سوف ينتهي عنده النسخ.
ملاحظات هامة :
- لو قمت بأدخال اي عامل من الثلاث عوامل (Target,Start,End) ارقام سالبة سوف يتم العد عكسي من اخر المصفوفة.
- لو قمت بأدخال target value رقم بعد start value سوف يتم النسخ تسلسلي حتي array length.
- دالة ()copyWithin تقوم بالتعديل علي المصفوفة الاصلية ويتم تبديل القيم بالقيم الجديدة.
- دالة ()copyWithin لا تغير عدد القيم length الموجوده بداخل المصفوفة.
تقوم دالة ()copyWithin بنسخ جزء من عناصر المصفوفة الي موقع اخر وإعادته دون تعديل طوله.
</>
()JavaScript Array method concat
دالة ()concat دوال المصفوفات في لغة جافا سكريبت
تستخدم دالة ( )concat في دمج مصفوفتين أو أكثر او دمج قيم وتقوم بأنشاء مصفوفة جديدة تحتوي علي قيم المصفوفات التي دمجناهم معاً او القيم الجديدة.
لا تغير الدالة ( )concat المصفوفات الموجودة ، ولكنها تقوم بأنشاء مصفوفة جديدة تحتوي على قيم المصفوفات المدمجة.
تقوم الدالة ( )concat بأنشاء مصفوفة جديدة تتكون من العناصر الخاصة بالمتغير الذي تم استدعائه.
دمج مصفوفتين عن طريق دالة concat وذلك في مصفوفة جديدة
let backEnd= ["PHP", "LARAVEL"]; let FrontEnd = ["HTML", "CSS", "JAVASCRIPT"]; let fullStack = backEnd.concat(FrontEnd);
- تأخذ دالة ()concat اي عدد من العوامل.
- يمكنك دمج قيم values او مصفوفات اخري arrays مع المصفوفة الاصلية organic Array.
- لا يوجد لها حد ادني او اقصي في عدد العوامل Parameters .
تصف العوامل بداخل دالة concat ويسبقها المصفوفة الرئيسية او الاصلية.
organicArray.concat(value1, value2, ..., valueN);
دمج مصفوفتين عن طريق دالة concat وذلك في مصفوفة جديدة
/* Organic Array*/ let backEnd= ["PHP", "LARAVEL"]; /* second Array*/ let frontEnd = ["HTML", "CSS", "JAVASCRIPT"]; /* third Array*/ let base = ["Algorithm", "DS"]; /* new Array store all values */ let fullStack = backEnd.concat(frontEnd ,base); document.write(fullStack);
ارجاع القيم عن طريقة دالة concat() في لغة جافا سكريبت concat() Return Value.
- يتم ارجاع القيم التي دمجها مع المصفوفة الاصلية organic array في مصفوفة جديدة نقوم بتحديد متغير لها.
- دالة concat() تقوم بأنشاء مصفوفة جديدة مع الاحتفاظ بالمصفوفة القديمة تضاف للمتغير نقوم بتحديدة.
</>
fill() Method arrays in JavaScript
دالة ()fill في المصفوفات في لغة جافا سكريبت
تستخدم دالة ()fill مع المصفوفات في لغة جافا سكريبت لتقوم باستبدال جميع قيم المصفوفة بقيمة ثابتة.
كيف تعمل دالة copyWithin() method Syntax؟
array.fill(value, start, end)
معطيات او عوامل دالة ()fill مع المصفوفات fill Parameters :
معطيات او عوامل (متغيرات) Parameters دالة ()fill:
تأخذ دالة ()fill ثلاث عوامل او ثلاث قيم وهم :
- Value القيمة الجديدة التي سوف نقوم باستبدال قيم المصفوفة بها.
- Start اختياري (optional) رقم العنصر index number الذي سوف تبدأ منه.
- end اختياري (optional) رقم العنصر index number الذي سوف تنتهي به.
قمنا باستبدال كل قيم المصفوفة بقيمة جديدة وهي PHP
let courses = ['HTML', 'CSS', 'JavaScript', 'MYSQL'];
document.write("<b>" + courses + "</b><br>");
document.write("<b>" + courses.fill('PHP') + "</b>");
قمنا باستبدال أول قيميتين من المصفوفة بدء من القيمة الاولي حتي القيمة الثانية بقيمة جديدة وهي PHP.
let courses = ['HTML', 'CSS', 'JavaScript', 'MYSQL'];
/* Before Change*/
document.write("<b>" + courses + "</b><br>");
document.write("<b>" + courses.fill('PHP',0,2) + "</b><br>");
/* After Change*/
document.write("<b>" + courses + "</b><br>");
ملاحظات هامة :
- دالة ()fill تقوم بارجاع مصفوفة جديدة معدلة بالقيم التي استبدلت من العوامل start و end.
- لو قمت بأدخال end أو start بأرقام سالبة سوف يتم العد من عكس المصفوفة بدأ ن اخر قيمة.
- الة ()fill تقوم بتغيير نفس المصفوفة وليس عمل نسخ للمفوفة اي القيم القديمة تم استداله بقيم جديدة في نفس المصفوفة.
</>
includes() Method arrays in JavaScript
دالة ()includes في المصفوفات في لغة جافا سكريبت
تستخدم دالة ()includes مع المصفوفات في لغة جافا سكريبت لتقوم بفحص قيمة ما داخل قيم المصفوفة.
كيف تعمل دالة includes() method Syntax؟
array.includes(value_To_Find, from_Index);
معطيات او عوامل دالة ()fill مع المصفوفات includes Parameters :
معطيات او عوامل (متغيرات) includes دالة ()includes:
تأخذ دالة ()includes عاملين وهم :
- Value to find القيمة التي سوف نقوم فحصها check داخل قيم المصفوفة.
- From index اختياري (optional) رقم العنصر index number الذي سوف تبدأ الفحص او البحث منه.
قمنا بالبحث عن هذة القيمة داخل جميع قيم المصفوفة وهي PHP وهي غير متاحة وسوف يتم ارجاع false يعني ذلك انها غير موجوده.
let courses = ['HTML', 'CSS', 'JavaScript', 'MYSQL'];
document.write("<b>" + courses.includes('PHP') + "</b>");
قمنا بالبحث عن هذة القيمة داخل جميع قيم المصفوفة وهي JavaScript وهي متاحة وسوف يتم ارجاع true يعني ذلك انها موجوده.
let courses = ['HTML', 'CSS', 'JavaScript', 'MYSQL'];
document.write("<b>" + courses.includes('JavaScript') + "</b>");
ملاحظات هامة :
- دالة ()includes تقوم بارجاع true في حال ان القيمة موجوده بداخل قيم المصفوفة.
- دالة ()includes تقوم بارجاع false في حال ان القيمة غير موجوده بداخل قيم المصفوفة.
</>
indexOf() Method arrays in JavaScript
دالة ()indexOf في المصفوفات في لغة جافا سكريبت
تستخدم دالة ()indexOf مع المصفوفات في لغة جافا سكريبت لتقوم بأرجاع رقم index لأي عنصر في المصفوفة العنصر الأول قيمته صفر 0.
كيف تعمل دالة indexOf() method Syntax؟
array.indexOf(searchElement, fromIndex);
معطيات او عوامل دالة ()indexOf مع المصفوفات includes Parameters :
معطيات او عوامل (متغيرات) indexOf دالة ()indexOf:
تأخذ دالة ()indexOf عاملين وهم :
- Element to find index القيمة التي سوف نقوم بالاستعلام عن رقمها index number داخل المصفوفة.
- Start search from اختياري (optional) رقم العنصر index number الذي سوف يبدأ البحث منه القيمة الافتراضية هي 0.
قمنا باضافة قيمة HTML لكي نستعلم عن index number بلغة جافا سكريبت رقم او ترتيب القيمة بداخل المصفوفة.
let courses = ['HTML', 'CSS', 'JavaScript', 'MYSQL'];
document.write("<b>" + courses.indexOf('HTML') + "</b>");
قمنا بالبحث عن هذة القيمة داخل جميع قيم المصفوفة وهي JavaScript وهي متاحة وسوف يتم ارجاع true يعني ذلك انها موجوده.
let courses = ['HTML', 'CSS', 'JavaScript', 'MYSQL'];
document.write("<b>" + courses.indexOf('JavaScript') + "</b>");
ملاحظات هامة :
- دالة ()indexOf تقوم بارجاع index number في حال ان القيمة موجوده مره واحده علي الاقل بداخل قيم المصفوفة.
- دالة ()indexOf تقوم بارجاع -1 في حال ان القيمة غير موجوده بداخل قيم المصفوفة.
</>
isArray() Method arrays in JavaScript
دالة ()isArray في المصفوفات في لغة جافا سكريبت
تستخدم دالة ()isArray في لغة جافا سكريبت لتقوم بفحص عامل argument [متغير - variable] هل هو مصفوفة ام لا.
كيف تعمل دالة indexOf() method Syntax؟
Array.isArray(value);
معطيات او عوامل دالة ()isArray مع المصفوفات isArray Parameters :
معطيات او عوامل (متغيرات) isArray دالة ()isArray:
تأخذ دالة ()isArray عامل فقط :
- value القيمة التي سوف نقوم بالاستعلام عنها اذا كانت مصفوفة ام لا.
قمنا بالاستعلام عن المتغير username سوف ترجع دالة isArray قيمة false اي انها ليست مصفوفة array.
let username = "Mohamed";
document.write("<b>" + Array.isArray(username) + "</b>");
قمنا بالبحث عن هذة القيمة داخل جميع قيم المصفوفة وهي JavaScript وهي متاحة وسوف يتم ارجاع true يعني ذلك انها موجوده.
let courses = ['HTML', 'CSS', 'JavaScript', 'MYSQL'];
document.write("<b>" + Array.isArray(courses) + "</b>");
ملاحظات هامة :
- دالة ()isArray تقوم بارجاع true في حال ان القيمة هي مصفوفة.
- دالة ()isArray تقوم بارجاع false في حال ان القيمة ليست مصفوفة.
</>
join() Method arrays in JavaScript
دالة ()join في المصفوفات في لغة جافا سكريبت
تستخدم دالة ()join في لغة جافا سكريبت لتقولم بارجاع نص string متسلسل concatenating مع علامة مثل الفواصل او العلامات التي سوف تفصل بين كل عنصر من عناصر المصفوفة عندما يتم ارجاعها كنص string.
كيف تعمل دالة join() method Syntax؟
array.join(separator);
معطيات او عوامل دالة ()join مع المصفوفات join Parameters :
معطيات او عوامل (متغيرات) join دالة ()join:
تأخذ دالة ()join عامل فقط :
- separator اختياري (optional) الفواصل او العلامات التي سوف تفصل بين كل عنصر من عناصر المصفوفة عندما يتم ارجاعها كنص string يمكنك عدم تحديدها وسوف تكون مسافة فارغة.
قمنا بالاستعلام عن المتغير username سوف ترجع دالة isArray قيمة false اي انها ليست مصفوفة array.
let courses = ['HTML', 'CSS', 'JavaScript', 'MYSQL'];
document.write("<b>" + courses.join("]|[") + "</b>");
قمنا بالبحث عن هذة القيمة داخل جميع قيم المصفوفة وهي JavaScript وهي متاحة وسوف يتم ارجاع true يعني ذلك انها موجوده.
let courses = ['HTML', 'CSS', 'JavaScript', 'MYSQL'];
document.write("<b>" + courses.join("-") + "</b>");
ملاحظات هامة :
- دالة ()join لن تغير في المصفوفة الاصلية organic Array.
- دالة ()join تقوم بارجاع القيم الفارغة undefined or null بنص فارغ.
</>
Array length Method in JavaScript
دالة length مع المصفوفات في لغة جافا سكريبت
تستخدم دالة length في لغة جافا سكريبت لتقوم بارجاع نص رقم وهو اجمالي عدد عناصر المصفوفة.
كيف تعمل length method Syntax؟
array.length
معطيات او عوامل دالة ()join مع المصفوفات join Parameters :
معطيات او عوامل (متغيرات) length دالة length:
- لا تأخذ دالة length اي عوامل فقط اسم المصفوفة يتبعها length.
قمنا بالاستعلام عن عدد عناصر المصفوفة وهو 4 عناصر.
let courses = ['HTML', 'CSS', 'JavaScript', 'MYSQL'];
document.write("<b>" + courses.length + "</b>");
قمنا بالاستعلام عن عدد عناصر المصفوفة وهو 6 عناصر.
let courses = ['HTML', 'CSS', 'JavaScript', 'MYSQL','PHP','MYSQL'];
document.write("<b>" + courses.length + "</b>");
ملاحظات هامة :
- يمكنك تغيير حجم length عدد عناصر المصفوفة عم طريق تعيين Assign قيمة لها وهي ان نساوي بالرقم الذي نريده وستفقد المصفوفة حينها القيم المقطوعه اذا كان الرقم المحدد اقل من عدد المصفوفة.
قمنا بالاستعلام عن عدد عناصر المصفوفة وهو 6 عناصر.
let courses = ['HTML', 'CSS', 'JavaScript', 'MYSQL','PHP','MYSQL'];
courses.length = 3;
document.write("<b>" + courses + "</b>");
</>
lastIndexOf() Method arrays in JavaScript
دالة ()lastIndexOf في المصفوفات في لغة جافا سكريبت
تستخدم دالة ()lastIndexOf في لغة جافا سكريبت لتقوم بجلب او ارجاع رقم اخر عنصر في المصفوفة مع الاخذ بالعلم ان المصفوفات تبدأ من الرقم صفر.
كيف تعمل دالة lastIndexOf() method Syntax؟
array.lastIndexOf(search_Element, from_Index);
معطيات او عوامل Parameters دالة ()lastIndexOf مع المصفوفات :
معطيات او عوامل (متغيرات) دالة lastIndexOf() :
تأخذ دالة ()lastIndexOf عاملين وهم :
- character قيمة نوعها نص وهي اي قيمة من عناصر المصفوفة لكي تقوم هذة الدالة بارجاع رقم لك وهو رقم العنصر الاخير في المصفوفة.
- index number مع character لكي تقوم الدالة بالبحث للخلف من index رقم عنصر معين واذا كان العنصر غير متاح سوف تقوم بارجاع -1 .
قمنا بالاستعلام عن عنصر ال JavaScript بداخل المصفوفة وهو رقم 2 وايضاً هو رقم 6 من حيث بدء العد من صفر فسوف تقوم الداله بارجاع اخر عنصر وهو 6.
let courses = ['HTML', 'CSS', 'JavaScript', 'MYSQL','PHP','MYSQL','JavaScript'];
document.write("<b>" + courses.lastIndexOf('JavaScript') + "</b>");
/* Return index number 2*/
يممكنا استخدام دالة lastIndexOf مع النصوص string سوف نبحث عن رقم حرف e بداخل المصفوفة وهو 3.
let username = "Ahmed";
document.write("<b>" + username.lastIndexOf('e') + "</b>");
/* Return letter number e = 3*/
قمنا بالاستعلام عن عنصر MYSQL وهو متاح والقيمه غير متاحه وقامت بارجاع رقمه وهو 3.
let courses = ['HTML', 'CSS', 'JavaScript', 'MYSQL','PHP','MYSQL'];
document.write("<b>" + courses.lastIndexOf('MYSQL',3) + "</b>");
/* Return index number 2*/
قمنا بالاستعلام عن عنصر MYSQL وهو متاح ولكن قمنا بتمرير قيمة index 1 الي الداله ليبدأ البحث الي الخلف والقيمه غير متاحه وقامت بارجاع -1 اي انها غير متاحه.
let courses = ['HTML', 'CSS', 'JavaScript', 'MYSQL','PHP','MYSQL'];
document.write("<b>" + courses.lastIndexOf('MYSQL',1) + "</b>");
/* Return index number 2*/
ملاحظات هامة :
- دالة ()lastIndexOf تقوم بارجاع الفهرس index لأي عنصر في المصفوفة اذا كان موجود مره واحده ع الاقل وهو اخر عنصر في حال ان كان موجود اكثر من مره.
- دالة ()lastIndexOf تقوم بارجاع -1 في حال ان القيمة ليست متاحة في المصفوفة.
</>
pop() Method arrays in JavaScript
دالة ()pop في المصفوفات في لغة جافا سكريبت
تستخدم دالة ()pop في لغة جافا سكريبت لتقوم بحذف كل عناصر المصفوفة وتقوم بأرجاع اخر عنصر في المصفوفة بدون العناصر الاخري.
كيف تعمل دالة pop() method Syntax؟
array.pop()
معطيات او عوامل Parameters دالة ()pop مع المصفوفات :
معطيات او عوامل (متغيرات) دالة ()pop :
- لا تأخذ دالة ()pop اي عوامل parameters .
قمنا بالاستعلام عن اخر عنصر في المصفوفة وهو MYSQL.
let courses = ['HTML', 'CSS', 'JavaScript', 'PHP','MYSQL',];
document.write("<b>" + courses+ "</b><br>");
document.write("<b>" + courses.pop() + "</b><br>");
document.write("<b>" + courses+ "</b>");
ملاحظات هامة :
- دالة ()pop تقوم بارجاع اخر عنصر في الصفوفة فقط مع حذفة من المصفوفة الاصلية فاذا قمت بطباعة المصفوفة بعد هذة العملية ستلاحظ ان المصفوفة بدون اخر عنصر.
- دالة ()pop تقوم بارجاع undefined في حال ان المصفوفة فارغة.
- دالة ()pop تغير في المصفوفة الاصلية وتحذف اخر عنصر وليس نسخ المصفوفة الي مصفوفة جديدة.
</>
push() Method arrays in JavaScript
دالة ()push في المصفوفات في لغة جافا سكريبت
تستخدم دالة ()push في لغة جافا سكريبت لتقوم باضافة عنصر او اكثر الي المصفوفات الي نهاية او اخر المصفوفة.
كيف تعمل دالة push() method Syntax؟
array.push(element_1, element_2, ..., element_X);
معطيات او عوامل Parameters دالة ()push مع المصفوفات :
معطيات او عوامل (متغيرات) دالة ()push :
تأخذ دالة ()push عامل واحد او اكثر وهم :
- Element or Elements اي قيمة تضاف في نهاية المصفوفة او اكثر تضاف كعنصر للمصفوفة ونفصل بينهم بالفاصلة comma.
قمنا بالاستعلام عن عنصر ال JavaScript بداخل المصفوفة وهو رقم 2 وايضاً هو رقم 6 من حيث بدء العد من صفر فسوف تقوم الداله بارجاع اخر عنصر وهو 6.
let courses = ['HTML', 'CSS', 'JavaScript', 'MYSQL'];
document.write("<b>" + courses + "</b><br>");
document.write("<b>" + courses.push('PHP') + "</b><br>");
document.write("<b>" + courses + "</b><br>");
ملاحظات هامة :
- دالة ()push تقوم بارجاع رقم الفهرس الخاص بالعنصر المضاف.
- دالة ()push تقوم بالتعديل علي المصفوفة الاصلية وليس عمل نسخه اخري منها.
CLOSETAG
منصة كلوز تاج التعليمية المتخصصة في تعليم البرمجة. نسعى لتقديم تجربة تعلم فريدة من خلال معسكراتنا العملية والمنظمة والمتسلسلة كما نهدف إلى تقليص الفجوة بين النظرية والتطبيق العملي؛ لذا فإننا نركز على التعليم القائم على المشاريع والتطبيقات الحقيقية. ننقل لك سنوات من الخبرة في أقل وقت ممكن تحت إشراف مهندسين عباقرة عملوا في أكبر الشركات العربية والعالمية في مجال البرمجة. مهمتنا ليست فقط تعليم البرمجة، بل نسعى أيضًا لتزويدك بمجموعة من المهارات التي تتوافق مع احتياجات سوق العمل.
