()forEeach(), Map(), Filter() And Reduce ما هم و ما الفرق بينهم في javascript ؟

forEach(), map(), filter() و reduce() هي وظائف مدمجة في JavaScript تستخدم للتعامل مع المصفوفات والقوائم. وهنا بعض الفروق بينهم:

forEach(): تستخدم forEach() لتكرار كل عنصر في المصفوفة وتنفيذ وظيفة معينة عليه. على سبيل المثال، إذا كان لدينا مصفوفة تحتوي على أرقام، يمكن استخدام forEach() لطباعة كل عنصر في المصفوفة:

const numbers = [1, 2, 3, 4, 5];
numbers.forEach(function(number) {
  console.log(number);
});

map(): تستخدم map() لإنشاء مصفوفة جديدة باستخدام قيم المصفوفة الأصلية والتي تم تحديدها عن طريق تطبيق دالة على كل عنصر. على سبيل المثال، إذا كان لدينا مصفوفة تحتوي على أرقام، يمكن استخدام map() لإنشاء مصفوفة جديدة تحتوي على نسخة مضاعفة من كل عنصر:

const numbers = [1, 2, 3, 4, 5];
const doubledNumbers = numbers.map(function(number) {
  return number * 2;
});
console.log(doubledNumbers); // Output: [2, 4, 6, 8, 10]

filter(): تستخدم filter() لإنشاء مصفوفة جديدة تحتوي على العناصر التي تم تحديدها باستخدام دالة معينة. على سبيل المثال، إذا كان لدينا مصفوفة تحتوي على أرقام، يمكن استخدام filter() لإنشاء مصفوفة جديدة تحتوي على الأرقام الزوجية فقط:

const numbers = [1, 2, 3, 4, 5];
const evenNumbers = numbers.filter(function(number) {
  return number % 2 === 0;
});
console.log(evenNumbers); // Output: [2, 4]

reduce(): تستخدم reduce() لتجميع القيم في مصفوفة وإرجاع قيمة واحدة. على سبيل المثال، إذا كان لدينا مصفوفة تحتوي على أرقام، يمكن استخدام reduce() لجمع الأرقام في المصفوفة:

const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce(function(total, number) {
  return total + number;
}, 0);
console.log(sum); // Output: 15

أما بالنسبة للفرق بين هذه الدوال وبين الـ for loop والـ while loop، فالفرق يكمن في الطريقة التي يتم بها التعامل مع البيانات. فالـ for loop والـ while loop يستخدمان لتنفيذ عملية معينة على عناصر المصفوفة بشكل متسلسل، بينما الدوال السابقة تستخدم لتطبيق وظيفة على عناصر المصفوفة بشكل متوازي. ويمكن استخدام أي منهم حسب الحاجة وطبيعة المهمة التي تحتاج إلى تنفيذها في مشروعك.

سأقدم لك مثالًا على الفرق بين استخدام الـ for loop و map() في جافاسكريبت:

لنفترض أن لدينا مصفوفة تحتوي على أرقام، ونحتاج إلى إنشاء مصفوفة جديدة تحتوي على نفس الأرقام ولكن مضاعفة القيم. يمكننا القيام بذلك باستخدام for loop على النحو التالي:

let numbers = [1, 2, 3, 4, 5];
let doubledNumbers = [];
for (let i = 0; i < numbers.length; i++) {
  doubledNumbers.push(numbers[i] * 2);
}
console.log(doubledNumbers); // [2, 4, 6, 8, 10]

ويمكن القيام بنفس العملية باستخدام دالة map() على النحو التالي:

let numbers = [1, 2, 3, 4, 5];
let doubledNumbers = numbers.map(function(number) {
  return number * 2;
});
console.log(doubledNumbers); // [2, 4, 6, 8, 10]

كما ترى، تقوم الدالة map() بإنشاء مصفوفة جديدة تحتوي على النتائج التي تم إنشاؤها، في حين يتم استخدام for loop لتعديل المصفوفة الحالية.

وبشكل عام، يمكن استخدام for loop و while loop و map() و filter() و reduce() في حالات مختلفة ويعتمد الاختيار على طبيعة المهمة التي تحتاج إلى القيام بها.

forEach، map، filter، و reduce ببساطة هي وظائف تُستخدم لتكرار عناصر المصفوفة، والفرق الرئيسي بينها هو ما تفعله بالعناصر أثناء التكرار.

• forEach يتكرر عبر جميع عناصر المصفوفة ويؤدي الوظيفة المحددة إلى كل منها.
• map يتكرر عبر جميع عناصر المصفوفة ويعيد مصفوفة جديدة تحتوي على ناتج تطبيق الوظيفة المحددة على كل عنصر.
• filter يتكرر عبر جميع عناصر المصفوفة ويعيد مصفوفة جديدة تحتوي فقط على العناصر التي تفي بشرط معين.
• reduce يتكرر عبر جميع عناصر المصفوفة ويجمعها معًا لإنشاء قيمة واحدة.

وإليك مثال على استخدام كل وظيفة:

const numbers = [1, 2, 3, 4, 5];

// forEach
numbers.forEach(number => console.log(number));

// map
const doubledNumbers = numbers.map(number => number * 2);
console.log(doubledNumbers); // [2, 4, 6, 8, 10]

// filter
const evenNumbers = numbers.filter(number => number % 2 === 0);
console.log(evenNumbers); // [2, 4, 6]

// reduce
const sumOfNumbers = numbers.reduce((a, b) => a + b, 0);
console.log(sumOfNumbers); // 15

for loop و while loop هي أيضًا وظائف تُستخدم لتكرار العناصر، ولكن الفرق الرئيسي بينها هو أن for loop يحدد عدد المرات التي يجب تكرار فيها الـ loop، بينما while loop يستمر في التكرار حتى يتم استيفاء شرط معين.

// for loop
for (let i = 0; i < 5; i++) {
  console.log(i);
}

// while loop
let i = 0;
while (i < 5) {
  console.log(i);
  i++;
}

لاحظ أن في for نقوم بالتكرار حتى وصول قيمة i رقم أقل من 5 ونستطيع تعديل تلك القيمة، بمعنى أن عدد مرات التكرار معروفة لدينا.

بينما في while لاحظ أن الحلقة تستمر في التكرار في حال الشرط ما زال صحيحًا أي تُستخدم حلقة while عندما لا تعرف عدد المرات التي يجب تكرار فيها التعليمات.

أي أن forEach، map، filter، و reduce هي وظائف أكثر تعقيدًا من for loop و while loop، ونستخدمها لكتابة كود أكثر كفاءة  وقابلية للقراءة.

forEach(), map(), filter(), وreduce() هي وظائف جداول JavaScript التي تستخدم للتعامل مع البيانات في مصفوفة وتنفيذ عمليات عليها. وإليك شرحًا لكل منها والفروق بينهم:

• forEach(): وظيفة forEach() تُسمح لك بتنفيذ وظيفة محددة على كل عنصر في المصفوفة. لا تعيد أي قيمة ولا تقوم بإنشاء مصفوفة جديدة.

const names = ["John", "Jane", "Mike"];

names.forEach((name) => {
  console.log(name);
});

// النتيجة
// John
// Jane
// Mike

• map(): وظيفة map() تُسمح لك بتطبيق وظيفة على كل عنصر في المصفوفة وإنشاء مصفوفة جديدة بناءً على القيم المُعدلة.

const names = ["John", "Jane", "Mike"];

const capitalizedNames = names.map((name) => {
  return name.toUpperCase();
});

console.log(capitalizedNames);

// النتيجة
// ["JOHN", "JANE", "MIKE"]

• filter(): وظيفة filter() تقوم بتصفية المصفوفة بناءً على شرط محدد وتنشئ مصفوفة جديدة تحتوي فقط على العناصر التي تمر بالشرط المحدد.

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

const evenNumbers = numbers.filter((number) => {
  return number % 2 === 0;
});

console.log(evenNumbers);

// النتيجة
// [2, 4, 6, 8, 10]

• reduce(): وظيفة reduce() تستخدم لتجميع قيم المصفوفة إلى قيمة واحدة واحدة. تنفذ وظيفة معينة على كل عنصر في المصفوفة وتستخدم القيمة المرجعة من العملية السابقة في العملية التالية.

const numbers = [1, 2, 3, 4, 5];

const sum = numbers.reduce((accumulator, number) => {
  return accumulator + number;
}, 0);

console.log(sum);

// النتيجة 
// 15

هذه الأمثلة توضح كيفية استخدام كل وظيفة (forEach(), map(), filter(), و reduce()) للتعامل مع المصفوفات وتنفيذ العمليات عليها بشكل مختلف. تتيح لك هذه الوظائف التلاعب بالبيانات بسهولة وإنشاء مصفوفات جديدة أو تحويل البيانات إلى شكل مرغوب.

يمكنك التوسع في فهم هذه المفاهيم من خلال التطيبق عليها واستخدامها المكثف.