فهرس الدليل

دليل شامل

JavaScript: الأنماط المتقدمة

📅 22 أغسطس 2026 | ⏱️ 30 دقيقة قراءة

JavaScript لغة برمجة قوية تدعم أنماط برمجة متقدمة مثل البرمجة غير المتزامنة، الوحدات، والدوال المغلقة.

🔄 الجزء الأول: البرمجة غير المتزامنة

1.1 Async/Await

async function fetchData() {
  try {
    const response = await fetch("https://api.example.com/data");
    const data = await response.json();
    console.log(data);
  } catch (error) {
    console.error("Error:", error);
  }
}

1.2 Promises

new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve("Success");
  }, 1000);
}).then(result => {
  console.log(result);
}).catch(error => {
  console.error(error);
});

💡 خلاصة:

  • ✅ async/await تجعل الكود غير المتزامن يبدو متزامناً.
  • ✅ Promise تمثل عملية ستكتمل في المستقبل.

🔒 الجزء الثاني: Closures

2.1 الدوال المغلقة

function createCounter() {
  let count = 0;
  return {
    increment: () => count++,
    decrement: () => count--,
    getCount: () => count
  };
}

const counter = createCounter();
counter.increment();

💡 خلاصة:

  • ✅ Closure تسمح للدالة بالوصول لمتغيرات النطاق الخارجي.
  • ✅ مفيدة لإنشاء بيانات خاصة (Private Data).

📦 الجزء الثالث: Modules

3.1 Export و Import

// math.js
export const add = (a, b) => a + b;
export const subtract = (a, b) => a - b;

// app.js
import { add, subtract } from "./math.js";
console.log(add(5, 3));

💡 خلاصة:

  • ✅ Modules تنظم الكود في ملفات منفصلة.
  • ✅ export للمشاركة، import للاستخدام.

📂 الجزء الرابع: Destructuring

4.1 تفكيك الكائنات والمصفوفات

const user = {
  name: "Ahmed",
  age: 25,
  city: "Cairo"
};

const { name, age } = user;
console.log(name);

💡 خلاصة:

  • ✅ Destructuring تستخرج القيم من الكائنات بسهولة.

📊 الجزء الخامس: Spread Operator

5.1 نشر العناصر

const arr1 = [1, 2, 3];
const arr2 = [...arr1, 4, 5];

const obj1 = { a: 1 };
const obj2 = { ...obj1, b: 2 };

💡 خلاصة:

  • ✅ Spread (...) ينشر العناصر في مصفوفة أو كائن.

🔄 الجزء السادس: Array Methods

6.1 Map, Filter, Reduce

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

const doubled = numbers.map(n => n * 2);
const evens = numbers.filter(n => n % 2 === 0);
const sum = numbers.reduce((acc, n) => acc + n, 0);

💡 خلاصة:

  • ✅ map للتحويل، filter للتصفية، reduce للتجميع.

📋 الجزء السابع: الملخص السريع

النمط الاستخدام
async/awaitبرمجة غير متزامنة
Promiseعمليات مستقبلية
Closureبيانات خاصة
Modulesتنظيم الكود
Destructuringاستخراج القيم
Spreadنشر العناصر
Map/Filterمعالجة المصفوفات

🎉 مبارك!

أصبحت الآن تفهم الأنماط المتقدمة في JavaScript.

تم نسخ الرابط!