ورقة JavaScript المرجعية
آخر تحديث
المتغيرات (let و const و var)
تعريف القيم؛ فضّل const، ثم let، وتجنّب var.
| العملية | الصياغة |
|---|---|
| نطاق الكتلة، يمكن إعادة الإسناد | let count = 0; |
| نطاق الكتلة، لا يمكن إعادة الإسناد | const name = "Ada"; |
| نطاق الدالة (قديم) | var x = 1; |
| التعريف دون قيمة | let result; |
| تعريفات متعددة | let a = 1, b = 2; |
| كائن ثابت (محتوياته قابلة للتغيير) | const user = {}; user.id = 1; |
أنواع البيانات
الأنواع الأولية والمرجعية بالإضافة إلى كيفية فحصها.
| النوع | مثال |
|---|---|
| رقم | let n = 42; |
| سلسلة نصية | let s = "hi"; |
| قيمة منطقية | let ok = true; |
| مصفوفة | let arr = [1, 2, 3]; |
| كائن | let obj = { id: 1 }; |
| Null / undefined | let a = null;, let b; |
| فحص النوع | typeof n |
| التحويل | Number("7"), String(42), Boolean(0) |
السلاسل النصية والقوالب الحرفية
بناء النص والتعامل معه.
| العملية | الصياغة |
|---|---|
| قالب حرفي | Hi ${name}, age ${age} (ضعه بين علامات backtick) |
| الطول | text.length |
| الأحرف الكبيرة / الصغيرة | text.toUpperCase(), text.toLowerCase() |
| إزالة المسافات | text.trim() |
| استبدال الكل | text.replaceAll("a", "b") |
| التقسيم إلى مصفوفة | text.split(",") |
| الاحتواء | text.includes("js") |
| التقطيع | text.slice(0, 3) |
المصفوفات ودوالها
مجموعات مرتّبة والدوال التي تتكرر عليها.
| العملية | الصياغة |
|---|---|
| الإضافة / الإزالة من النهاية | arr.push(4), arr.pop() |
| الإضافة / الإزالة من البداية | arr.unshift(0), arr.shift() |
| تحويل كل عنصر | arr.map(x => x * 2) |
| الإبقاء على العناصر المطابقة | arr.filter(x => x > 0) |
| الاختزال إلى قيمة واحدة | arr.reduce((sum, x) => sum + x, 0) |
| إيجاد عنصر | arr.find(x => x.id === 1) |
| اختبار some / every | arr.some(f), arr.every(f) |
| فهرس قيمة | arr.indexOf(3), arr.includes(3) |
| الدمج في سلسلة نصية | arr.join(", ") |
الكائنات
مجموعات مفتاح-قيمة.
| العملية | الصياغة |
|---|---|
| الإنشاء | const user = { id: 1, name: "Ada" }; |
| الوصول إلى خاصية | user.name, user["name"] |
| إضافة / تحديث خاصية | user.age = 25; |
| حذف خاصية | delete user.age; |
| الحصول على كل المفاتيح / القيم | Object.keys(user), Object.values(user) |
| الحصول على المدخلات | Object.entries(user) |
| دمج الكائنات | Object.assign({}, a, b) |
| نسخ سطحي | const copy = { ...user }; |
التحكم في التدفق
الشروط والحلقات.
| العملية | الصياغة |
|---|---|
| If / else if / else | if (x > 0) { … } else { … } |
| الشرطي الثلاثي | const y = x > 0 ? 1 : 0; |
| Switch | switch (x) { case 1: … break; } |
| حلقة for | for (let i = 0; i < 5; i++) { … } |
| For-of (القيم) | for (const item of arr) { … } |
| For-in (المفاتيح) | for (const key in obj) { … } |
| حلقة while | while (x < 10) { … } |
الدوال والدوال السهمية
تعريف كتل قابلة لإعادة الاستخدام والاستدعاء.
| العملية | الصياغة |
|---|---|
| تعريف دالة | function add(a, b) { return a + b; } |
| دالة سهمية | const add = (a, b) => a + b; |
| دالة سهمية بوسيط واحد | const sq = x => x * x; |
| دالة سهمية بلا وسائط | const now = () => Date.now(); |
| وسيط افتراضي | function f(x = 0) { … } |
| وسائط متبقية (rest) | function f(...args) { … } |
| تُستدعى فورًا (IIFE) | (() => { … })(); |
التفكيك والنشر (spread)
تفريغ القيم ونسخ/دمج الهياكل.
| العملية | الصياغة |
|---|---|
| تفكيك المصفوفة | const [a, b] = arr; |
| تفكيك الكائن | const { id, name } = user; |
| إعادة التسمية أثناء التفريغ | const { id: userId } = user; |
| قيمة افتراضية | const { age = 0 } = user; |
| نشر مصفوفة | const all = [...a, ...b]; |
| نشر كائن | const next = { ...user, age: 25 }; |
| المتبقي في التفكيك | const [first, ...rest] = arr; |
الوعود (Promises) و async/await
التعامل مع العمل غير المتزامن مثل طلبات الشبكة.
| العملية | الصياغة |
|---|---|
| دالة async | async function load() { … } |
| انتظار وعد | const data = await fetch(url); |
| Then / catch | promise.then(res => …).catch(err => …) |
| Try / catch مع await | try { await f(); } catch (e) { … } |
| الحلّ / الرفض | Promise.resolve(1), Promise.reject(err) |
| انتظار الكل | await Promise.all([a, b]) |
| أول من ينتهي | await Promise.race([a, b]) |
صياغة JavaScript الحديثة التي تستخدمها أكثر من غيرها، على صفحة واحدة. ورقة JavaScript المرجعية هذه هي مرجع سريع لـ ES6+ اليومية - تعريف المتغيرات، ودوال السلاسل النصية والمصفوفات، والكائنات، والدوال السهمية، والتفكيك، و async/await.
كل ما هنا هو JavaScript قياسية تعمل في المتصفحات الحديثة و Node.js. انسخ ما تحتاجه، أو جرّب أيّ مقطع برمجي مباشرة في playground الخاص بـ JS - دون الحاجة إلى تثبيت أي شيء.
الأسئلة الشائعة حول ورقة JavaScript المرجعية
هل ورقة JavaScript المرجعية هذه مجانية؟
نعم. ورقة JavaScript المرجعية هذه مجانية تمامًا، دون الحاجة إلى التسجيل. أضِفها إلى المفضلة وارجع إليها متى احتجت إلى البحث عن صياغة أو دالة مصفوفة أو نمط غير متزامن.
ما الفرق بين == و === في JavaScript؟
== هي المساواة المرنة: تحوّل المعاملات إلى النوع نفسه قبل المقارنة، لذا 0 == "0" تساوي true. أمّا === فهي المساواة الصارمة: تقارن القيمة والنوع معًا دون تحويل، لذا 0 === "0" تساوي false. فضّل === (و !==) في جميع الحالات تقريبًا - فهي متوقّعة وتتجنّب التحويلات المفاجئة.ما الفرق بين let و const و var؟
const و let بنطاق الكتلة وقد أُضيفتا في ES6؛ بينما تتمتّع var بنطاق الدالة وهي أقدم. استخدم const للقيم التي لا تعيد إسنادها أبدًا، و let للقيم التي تعيد إسنادها، وتجنّب var لتفادي أخطاء الرفع (hoisting) والنطاق. لاحظ أن كائن أو مصفوفة const لا يزال بإمكان محتواه أن يتغيّر - الثابت هو الارتباط (binding) فقط.هل يمكنني التدرّب على JavaScript عبر الإنترنت؟
نعم. افتح playground الخاص بـ JS لتشغيل أيّ مقطع برمجي من هذه الورقة المرجعية في متصفحك - دون الحاجة إلى تثبيت أي شيء. وعندما ترغب في تعلّم منظّم، تأخذك دورة JavaScript التفاعلية المجانية من Coddy من المتغيرات والحلقات إلى دوال المصفوفات و async/await خطوة بخطوة.
هل هذه الورقة المرجعية مناسبة للمبتدئين؟
نعم. إنها مرتّبة من الأساسيات (المتغيرات وأنواع البيانات والسلاسل النصية) وصولًا إلى التفكيك و async/await، بحيث يمكنك استخدام الأقسام العلوية من اليوم الأول والتدرّج إلى ميزات ES6+ الحديثة.
موارد ذات صلة
المزيد من الأوراق المرجعية
