في هذا الدرس 6تصفّح المواضيع
تُستخدم السلاسل النصية (Strings) لحفظ ومعالجة كل محتوى نصي في التطبيق من أسماء ورسائل وعناوين. وعند الحاجة لإدراج علامة تنصيص مطابقة لعلامة الإحاطة أو النزول إلى سطر جديد داخل النص الكلاسيكي، نستخدم الشرطة العكسية لمحارف الهروب (Escape Characters) مثل \' و\" ورمز السطر الجديد \n والشرطة العكسية الصريحة \\.
تمتلك كل سلسلة نصية خاصية .length (تُكتب كخاصية بلا أقواس!) لمعرفة عدد محارفها شاملاً المسافات. ويبدأ ترقيم المواقع من الصفر (Zero-Based Indexing) فيكون الحرف الأول عند str[0]، بينما تمنحنا الدالة الحديثة str.at(-1) قراءة أنيقة ومباشرة لآخر حرف من نهاية النص.
const brand = 'CloseTag';
const first = brand[0];
const last = brand.at(-1);
document.getElementById('str-idx').textContent =
brand.length + ' chars | ' + first + ' .. ' + last;تخضع السلاسل النصية في JavaScript لقاعدة الثبات الصارم (Immutability)؛ فبمجرد إنشاء النص في الذاكرة يستحيل تعديل حرف واحد بداخله موضعياً مثل word[0] = "B";، بل تُنتج جميع الدوال النصية سلسلة نصية جديدة تماماً مستقلة عن الأصل.
قدّم إصدار ES6 القوالب النصية الحديثة (Template Literals) المحاطة بعلامتي المائلة الخلفية Backticks (`...` وتقع غالباً أعلى مفتاح Tab في لوحة المفاتيح)، وبداخلها يمكنك كتابة علامات التنصيص المفردة والمزدوجة معاً بحرية تامة دون أي تهريب:
| الميزة | التنصيص التقليدي "..." | القوالب النصية `...` |
|---|---|---|
جمع علامتي ' و" بالداخل | يتطلب محرف الهروب \" | متاح مباشرةً بلا شرطة عكسية |
| إدراج المتغيرات والمعادلات | تقطيع مرهق بمعامل + | تضمين أنيق مباشر عبر ${...} |
| النصوص متعددة الأسطر | يتطلب كتابة \n يدوياً | يحفظ النزول للسطر الجديد تلقائياً |
داخل القالب النصي المحاط بعلامتي `...` تفتح الصيغة ${...} خانة تضمين فورية (String Interpolation)؛ حيث يحسب المحرك قيمة المتغير أو التعبير الرياضي بداخلها ويدمج النتيجة بسلاسة وسط الجملة دون الحاجة لتقطيع النص بعلامات +.
const student = 'Lina';
const done = 12, total = 159;
document.getElementById('tpl-out').textContent =
`${student}: ${done}/${total} (${total - done} left)`;تحفظ القوالب النصية الانتقال للأسطر الجديدة بصورة طبيعية تماماً، وتتكامل مع دوال التنسيق الأساسية: toUpperCase() لتكبير الأحرف، وtoLowerCase() لتوحيد البريد الإلكتروني بأحرف صغيرة، وtrim() لحذف المسافات الزائدة في الطرفين، وslice(start, end) لاقتطاع جزء محدد من فهرس البداية إلى ما قبل فهرس النهاية.
const rawEmail = ' [email protected] ';
const cleanEmail = rawEmail.trim().toLowerCase();
const domain = cleanEmail.slice(8);
document.getElementById('fmt-out').textContent =
`Email: ${cleanEmail}\nDomain: ${domain}`;ملخص الدرس
حصاد الدرسمراجعة مركّزة لأهم المفاهيم والقواعد الهندسية التي أتقنتها في هذا الدرس قبل التطبيق العملي
ماذا تعلّمت في هذا الدرس؟
أتقنت في هذا الدرس محارف الهروب النصية، وخاصية الطول والوصول للمحارف عبر .at(-1)، وقاعدة ثبات السلاسل النصية، والقوالب النصية الحديثة `...` مع التضمين ${...} ودوال التنسيق والاقتطاع. الخطوة التالية: ابدأ الفصل الثالث مع درس «المعاملات الحسابية في JavaScript» لإتقان العمليات الرياضية وباقي القسمة والأسس.
سجّل الدخول لحفظ تقدمك
تابع إنجاز المواضيع والمصطلحات والمهام، وكمّل من آخر خطوة على أي جهاز.
المصطلحات4
راجع المعنى، اشرحه لنفسك، ثم علّم البطاقة كمفهومة.
- 01 Template Literal القالب النصي الحديث
- سلسلة نصية حديثة تحاط بعلامتي المائلة الخلفية (`...`) وتدعم تعدد الأسطر وتضمين المتغيرات مباشرة.
- للمراجعة
- 02 String Interpolation التضمين النصي المباشر
- إدراج قيم المتغيرات ونواتج المعادلات مباشرةً في قلب النص باستخدام الصيغة ${...} داخل القالب.
- للمراجعة
- 03 String Immutability ثبات السلسلة النصية
- قاعدة تعني استحالة تعديل محارف النص الأصلي موضعياً في الذاكرة، بل تنتج الدوال نصاً جديداً مستقلاً.
- للمراجعة
- 04 Escape Sequence محرف الهروب النصي
- تركيبة تبدأ بالشرطة العكسية مثل \n للسطر الجديد أو \" لإدراج علامة تنصيص داخل النص.
- للمراجعة
لا توجد بطاقات تطابق البحث والتصفية.
اقرأ البطاقات بحرية. سجّل الدخول لحفظ تقدم مراجعتك.
الاختصارات2
راجع المعنى، اشرحه لنفسك، ثم علّم البطاقة كمفهومة.
- 01 UTF-16 UTF-16
- 16-Bit Unicode Transformation Format
- نظام ترميز المحارف ذو الـ 16 بت المعتمد داخلياً لتمثيل النصوص وحساب طولها في JavaScript.
- للمراجعة
- 02 SKU SKU
- Stock Keeping Unit
- رمز تعريف المنتج النصي المنظم الذي يُنسق ويُقتطع غالباً بدوال النصوص مثل slice وtoUpperCase.
- للمراجعة
لا توجد بطاقات تطابق البحث والتصفية.
اقرأ البطاقات بحرية. سجّل الدخول لحفظ تقدم مراجعتك.
مهامك قبل الاختبار
خطوة صغيرة كل مرة. وإنجاز تقدر ترجع له.
-
استعرض التبويبين الثاني والثالث في المحاكي للتأكد من بقاء النص الأصلي دون تغيير واقتطاع 4 محارف بدالة slice.
-
شغّل مثال تنسيق البريد الإلكتروني في محرر التجربة وجرّب عنواناً جديداً يحتوي مسافات وأحرفاً كبيرة.
تأشير المهمة إقرار منك بإتمامها، وليس تصحيحًا آليًا للكود. يُحفظ تقدمك في حسابك.
اختبر فهمك.
ووصلها للإتقان.
كل سؤال خطوة لقدّام. اختار، اكتب كود، وشوف نتيجتك فورًا.
أكمل المهام، واجمع كل الإجابات الصحيحة. أقل من 100%؟ راجع وأعد المحاولة.
الأسئلة متاحة للاطلاع. سجّل الدخول للتفاعل وحفظ تقدمك.