كما نعلم جميعًا، يعد طلب البيانات من الواجهة الخلفية ومعالجة البيانات من المهارات الأساسية لمهندسي الواجهة الأمامية. غالبًا ما يتم إرجاع البيانات المطلوبة من الواجهة الخلفية إلى الواجهة الأمامية في شكل مصفوفة، لذلك يمكن توضيح أهمية أساليب معالجة المصفوفة. يتخيل؛ في العمل،
هي دالة. المعلمة الرسمية الأولى للوظيفة التي تم تمريرها داخليًا هي قيمة كل عنصر في مصفوفة العنصر والثاني هو فهرس رقم الفهرس، وقيمة الإرجاع غير محددة؛
مثال التشغيل هو كما يلي:
إخراج وحدة التحكم
طريقة التصفية () هي طريقة لتصفية المصفوفات، المعلمات التي تم تمريرها هي نفس طريقة forEach، ولكن القيمة المرجعة هي مصفوفة البيانات المكتسبة؛
مثال التشغيل هو كما يلي:
إخراج وحدة التحكم كما يلي:
المعلمات التي تم تمريرها بواسطة طريقة الخريطة () هي أيضًا نفس ما ورد أعلاه، وقيمة الإرجاع الخاصة بها هي أيضًا مصفوفة جديدة؛ المثال هو كما يلي:
إخراج وحدة التحكم:
تقوم طريقة findIndex ()، كما يوحي اسمها، بإرجاع رقم الفهرس للعنصر الأول في المصفوفة الذي يلبي الشروط، وإذا لم يتم العثور عليه، فإنها تُرجع -1. المعلمات التي تم تمريرها هي نفسها المذكورة أعلاه، والمثال قيد التشغيل هو كما يلي:
Let arr = [1, 3, 3, 4, 5, 6, 7] // طريقة findIndex، تُرجع رقم فهرس العنصر الأول الذي يستوفي الشروط، وإذا لم يتم العثور عليه، تُرجع -1 const res = arr.findIndex((item) => item > 5)
نتائج إخراج وحدة التحكم
console.log(res):
تقوم طريقة find () بإرجاع العنصر الأول الذي تم العثور عليه والذي يلبي الشروط، المعلمات التي تم تمريرها هي نفسها المذكورة أعلاه. المثال الجاري هو كما يلي:
Let arr = [1, 3, 3, 4, 5, 6, 7] //find () يبحث عن العنصر ويعيد العنصر الأول الذي يستوفي الشروط، وإذا وجد، فإنه يُرجع غير محدد. const res2 = arr.find((item) => { إرجاع السلعة > 5 })نتائج تشغيل وحدة التحكم
console.log(res2)
هي كما يلي:
المعلمات التي تم تمريرها بواسطة طريقة some() هي نفسها المذكورة أعلاه، والقيمة المرجعة هي قيمة منطقية طالما تم العثور على عنصر يلبي الشروط، فسيعود المثال كما يلي :
دع arr = [1، 3، 3، 4، 5، 6، 7] // تُرجع بعض الطرق قيمة منطقية const bl = arr.some((item) => { إرجاع السلعة > 5 }) console.log(بل)
المعلمات التي تم تمريرها بواسطة أسلوب every() هي نفسها المذكورة أعلاه، والقيمة المرجعة هي قيمة منطقية، ولكن يجب أن يستوفي كل عنصر الشروط لإرجاع صحيح، المثال كما يلي:
Let arr = [1 ، 3، 3، 4، 5، 6، 7] // every() يُرجع قيمة منطقية يجب أن تمر بشروط التصفية قبل أن تُرجع صحيحة const bl2 = arr.every((currentValue) => { إرجاع القيمة الحالية <10 }) console.log(bl2)
المعلمة الأولى في وظيفة تقليل () هي الوظيفة، المعلمة الثانية هي نوع مجموع المتغير المؤقت، وظيفة المعلمة الأولى لها أربع معلمات، ولكن المعلمة الأولى شائعة الاستخدام هي تجميع المتغيرات المؤقتة (إرجاع هذه القيمة)، عنصر المعلمة الثاني. والثالث هو الفهرس، والرابع هو المصفوفة نفسها، مثال الكود كما يلي:
Let arr = [1, 3, 3, 4, 5, 6, 7] //تقليل () الدالة التعريفية const PreviousValue = 0 const arrSum = arr.reduce((القيمة السابقة، القيمة الحالية) => { إرجاع القيمة السابقة + القيمة الحالية }, 0)نتائج إخراج وحدة التحكم
console.log(arrSum)
هي كما يلي:
concat() يربط صفيفين ويعيد المصفوفة الجديدة المقسمة (المصفوفات داخل المصفوفات) لا يمكن ربطها.
مثال الكود كالتالي:
Let arr = [1, 3, 3, 4, 5, 6, 7]
// يسلسل صفيفين ويعيد مصفوفة جديدة
const newArr3 = [2, 5, 5, 6, 6, 8]
const concatArr = arr.concat(newArr3)
console.log(concatArr)
طريقة الدفع()/unshift() هي إضافة عنصر في نهاية المصفوفة وأمامها على التوالي، والقيمة المرجعة هي طول المصفوفة الجديدة
؛ ستتغير طريقة معالجة المصفوفة. const Arr = [1, 3, 5, 6, 7, 8, 9] آر.بوش(1) console.log(آر) console.log(آر) const a = Arr.unshift(1)
نتائج إخراج وحدة التحكم
console.log(a)هي كما يلي:
هاتان الطريقتان pop() تحذف القيمة الأخيرة للمصفوفة، وshift() تحذف قيمة العنصر الأول في المصفوفة؛ القيمة المرجعة هي العنصر المحذوف
؛ console.log(arr) وصول.التحول(1)نتائج إخراج وحدة التحكم
console.log(arr)
هي كما يلي:
طريقة الفرز () هي وظيفة الفرز، function(a, b){ return a - b }. الدالة بترتيب تصاعدي. إذا كانت قيمة الإرجاع الداخلي a - b بترتيب تنازلي، فإن الإرجاع a + b بترتيب تصاعدي؛
Reverse() عبارة عن قلب مصفوفة، أي ترتيب عناصر المصفوفة بترتيب عكسي؛ مثال الكود كما يلي:
Let arr = [1, 3, 3, 4, 5, 6, 7]arr.sort( (أ، ب) => { إرجاع أ - ب})console.log(arr)arr.reverse()console.log(arr)
تقوم طريقة splice() بتعديل المصفوفة الأصلية وإرجاع مصفوفة جديدة تحتوي على عناصر محذوفة، والرقم السالب هو رقم الفهرس من الخلف إلى الأمام؛ المعلمة الثانية هي عدد العناصر المحذوفة؛
Let arr = [1, 3, 3, 4, 5, 6, 7]arr.splice(1, 3)console.log(arr)يتم استخدام
flat() لتسوية المصفوفات متعددة الأبعاد، المعلمة التي تم تمريرها هي عمق المصفوفة، والتي يمكن أيضًا أن تكون غير محدودة، مما يعني أن عمق المصفوفة لا نهائي :
ثابت Arr2 = [ [1، 2]، [ثلاثة وعشرين]، [4، 5]، [5, 6],]console.log(Arr2.flat(Infinity))
نتائج إخراج وحدة التحكم:
ملء مصفوفة: طريقة الكتابة: Array.fill(1, 2, 4) يملأ المصفوفة بالرقم 1، بدءًا من العنصر ذي قيمة الفهرس 2، بدءًا من رقم فهرس العنصر بدءًا من 4، باستثناء قيمة الفهرس هي 4 عناصر؛ العنصر المملوء سيحل محل العنصر الأصلي المطابق لرقم الفهرس؛
مثال التعليمات البرمجية كما يلي:
const Arr2 = [ [1، 2]، [ثلاثة وعشرين]، [4، 5]، [5, 6],]console.log(Arr2.fill(1, 0, 4))
نتائج إخراج وحدة التحكم: