كيفية استخدام ES6 قالب الحرفي في جافا سكريبت

في البرمجة ، والمصطلح “حرفي” بالعودة الى تدوين القيم في الرمز. على سبيل المثال ، نلاحظ قيمة سلسلة مع سلسلة حرفية هي أحرف محاطة بعلامات اقتباس مزدوجة أو مفردة ("فو", 'شريط', "هذه سلسلة!").

حرفية القالب تم تقديمها في ECMAScript 6. أنها تعمل بشكل مشابه تمامًا للحرفية الحرفية ؛ ينتجون قيم القالب و قيم القالب الخام, كلاهما سلاسل.

ومع ذلك ، بخلاف القيم الحرفية للسلسلة ، يمكن أن تنتج القيم الحرفية للقالب قيمًا سلاسل متعددة الخطوط, شيء يمكنك تحقيقه في سلسلة حرفية فقط بواسطة إضافة أحرف سطر جديد (\ ن) لذلك.

يمكن الحرفي قالب أيضا إنشاء سلاسل مع القيم الأخرى (المستمدة من التعبيرات) التي يجب عليك استخدام زائد المشغل في سلسلة حرفية ("المعرف الخاص بك هو:" + idNo. أين رقم بطاقة الهوية تعبير متغير بقيمة رقمية).

كل هذه الميزات تجعل من قوالب الحرف أكثر تفضيلاً إنشاء قيم السلسلة.

بناء جملة القوالب الحرفية

محدد القالب الحرفي هو الفاصلة العليا المائلة ' حرف (تعرف أيضًا باسم حرف backquote أو رمز لهجة خطيرة). تعبير داخل الحرفي (القيمة التي هي تقييمها خلال وقت التشغيل والمضمنة في القيمة النهائية التي تنتجها الحرفية) مرفقة في الأقواس المعقوفة مع علامة الدولار السابقة $.

 'string $ someExpression more string' 

هنا بعض أمثلة من القوالب الحرفية إنتاج دون تغيير, استبدال (تم استبدال التعبيرات بقيمها المقيمة) ، و متعددة اصطف سلاسل.

 console.log ( 'مرحبا')؛ // hello var name = "Joan"؛ console.log ('hello $ name') ؛ // hello Joan console.log ('عزيزي جوان ، مرحبًا.') ؛ // عزيزي جوان ، // مرحبا. 

الهروب والقيم القالب الخام

في قالب الحرفي ، و ' (الفاصلة العليا المائلة), \ (الخط المائل العكسي) ، و $ (علامة الدولار) الأحرف يجب أن يهرب باستخدام هروب الشخصية \ إذا كانت ليتم تضمينها في قيمة القالب الخاصة بهم.

بشكل افتراضي ، تكون كافة تسلسلات الهروب في قالب حرفية تجاهل. إذا كنت ترغب في تضمينه في الإخراج ، فأنت بحاجة إلى استخدامه قيمة القالب الخام.

 console.log ('الكود المضمن في الترميز: \' code \ ") ؛ // الكود المضمن في الترميز: 'code' var name =" Joan "؛ console.log ('hello \ $ name.')؛ / / hello $ name. console.log (String.raw'hello \ $ name. ')؛ // hello \ $ name. 

ال String.raw طريقة مخرجات قيم القالب الخام (شكل السلسلة الخام للقالب الحرفي). في التعليمات البرمجية أعلاه ، استدعاء دالة من الخام يشار إلى الطريقة “قالب الموسومة”.

قوالب الموسومة

قالب الموسومة هو استدعاء وظيفة أين, بدلا من الأقواس المعتادة (مع المعلمات الاختيارية) إلى جانب اسم الوظيفة, هناك قالب الحرفي من خلالها تحصل الوظيفة على حججها.

لذلك ، بدلاً من استدعاء دالة مثل هذا:

 فو (ArgumentsForFoo)؛ 

يطلق عليه مثل هذا:

 foo'ATemplateStringProvidingArgumentsForFoo '؛ 

الوظيفة فو يسمى أ وظيفة العلامة. أول حجة وردت من القالب الحرفي هو مجموعة مصفوفة دعا كائن القالب.

كائن القالب (صفيف) يحمل جميع القيم سلسلة فسر من القالب الحرفي وله الخام خاصية (مجموعة أخرى) يحمل كافة قيم السلسلة الخام (un-escaped) فسر من نفس الحرفي.

باتباع كائن القالب ، تتضمن وسائط دالة العلامات كل ال تقييم القيم الخارجية موجودة في هذا الحرفي (تلك المغلقة في الأقواس المتعرجة $ ).

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

 اسم فار = "جون" ؛ var id = 478؛ foo'hello $ name. المعرف الخاص بك هو: $ id. '؛ function foo () console.log (arguments [0]) ؛ // صفيف ["مرحبًا" ، ". هويتك:" ، "." ] console.log (الوسائط [1]) ؛ // John console.log (arguments [2])؛ // 478 

الحجة الأولى أنتجت هي كائن القالب تحمل كل السلاسل المترجمة من القالب الحرفي ، الحجج الثانية والثالثة هي القيم المقدرة من التعبيرات, اسم و هوية شخصية.

ال الخام خاصية

كما ذكر من قبل ، يحتوي كائن القالب على خاصية تسمى الخام وهو مجموعة تحتوي على كافة قيم السلسلة الخام (un-escaped) فسر من القالب الحرفي. هذه هي الطريقة التي يمكنك الوصول إلى الخام خاصية:

 var name1 = "John"، name2 = "Joan"؛ foo'hello \ $ name1 ، $ name2 ، كيف حالكما؟ '؛ function foo () console.log (arguments [0]) ؛ // Array ["hello $ name1،"، "، كيف أنتما كلاهما؟"] console.log (arguments [0] .raw)؛ // Array ["hello \ $ name1،"، "، كيف أنتما كلاهما؟"] console.log (arguments [1])؛ // جوان 

استخدام حالات القوالب الموسومة

القوالب ذات العلامات مفيدة عندما تحتاج إليها كسر سلسلة إلى أجزاء منفصلة كما هو الحال في كثير من الأحيان في URL ، أو أثناء تحليل لغة. ستجد مجموعة من أمثلة قالب الموسومة هنا.

بخلاف IE ، تكون القيم الحرفية هي معتمد في جميع المتصفحات الرئيسية.

أدناه ، يمكنك العثور على بعض الأمثلة لوظائف العلامات مع تواقيع مختلفة التي تمثل الحجج:

 اسم فار = "جون" ؛ foo'hello $ name ، كيف حالكما؟ "؛ bar'hello $ name ، كيف أنتما كلاهما؟ '؛ function foo (... args) console.log (args)؛ // Array [Array ["hello"، "، كيف حالكما؟"] ، "John"] شريط الوظائف (strVals، ... exprVals) console.log (strVals)؛ // صفيف ["مرحبًا" ، "كيف حالكما؟" ] console.log (exprVals) ؛ // Array ["John"] 

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

ضع الخيط معًا

أذا أردت الحصول على الجملة بأكملها (مشتق من الحرفي) داخل وظيفة العلامة, سلسل كل القيم المصفوفات التي تحمل سلاسل القوالب وقيم التعبير المقيَّمة. مثله:

 الدالة foo (strs، ... exprs) // إذا كان هناك أي تعبيرات مضمنة في الحرفي إذا (exprs.length! == 0) var n = strs.length - 1، result = "؛ for (var i = 0 ؛ أنا < n; i++)  result += strs[i] + exprs[i];  result += strs[n]; console.log(result); //"Hello John."  // if there are no expressions included in the literal else console.log(strs[0]);  name = 'John'; foo'Hello $name.'; 

ال تقارير المعاملات المشبوهة يحمل مجموعة كل الاوتار وجدت في الحرفي و exprs يحمل جميع قيم التعبير المقدرة من الحرفي.

في حالة وجود قيمة تعبير واحدة ، سلسل كل قيمة صفيف تقارير المعاملات المشبوهة (ما عدا آخر واحد) بنفس قيمة الفهرس لـ exprs. ثم ، في النهاية ، أضف القيمة الأخيرة لل تقارير المعاملات المشبوهة مجموعة إلى سلسلة متسلسلة, تشكيل جملة كاملة من هنا.