ملخص شامل للغاية لمواصفات كتابة الكود الشائعة في JavaScript

1. تلوث مساحة الأسماء العالمية

قم دائمًا بلف الكود في تعبير وظيفة فوري لتشكيل وحدة مستقلة.

غير موصى به

 var x = 10 ، y = 100 ؛ console.log (window.x + '' + window.y) ؛

يوصي

 ،

2. قم بتنفيذ الوظيفة على الفور

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

ويجب عليك إضافة undefined إلى المعلمات الرسمية للوظيفة على الفور ، في الموضع الأخير ، لأنه يمكن قراءة وكتابة undefined في ES3. إذا تم تغيير قيمة undefined في الموضع العالمي ، فقد لا يحصل الرمز الخاص بك على نتائج متأخرة.

بالإضافة إلى ذلك ، يوصى بإضافة فاصلة فاصلة في بداية ونهاية الوظيفة على الفور لتجنب التأثير على الكود الخاص بنا بسبب رمز الأشخاص الآخرين غير المنتظم أثناء الدمج.

غير موصى به

 (function () {'use strict' ؛ var x = 10 ، y = 100 ، c ، elem = $ ('body') ؛ console.log (window.x + '' + window.y) ؛ $ (document) .on ('click' ، function () {}) ؛ if (typef c === ') {// code}}} () ؛

يوصي

 ؛ (الوظيفة ($ ، window ، document ، undefined) {'use strict' ؛ var x = 10 ، y = 100 ، c ، elem = $ ('body') ؛ console.log (window.x + '' + window.y) ؛ $ (document) .on ('click' ، function () {}) ؛ if (typeof c ==== ')

3. الوضع الصارم

يمكن تنشيط الوضع الصارم ECMASSCRIPT 5 عبر البرنامج النصي أو داخل طريقة واحدة. إنه يتوافق مع سياقات JavaScript المختلفة وسيقوم بإجراء فحوصات خطأ أكثر صرامة. يضمن الوضع الصارم أيضًا أن يكون رمز JavaScript أكثر قوة ويعمل بشكل أسرع.

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

يجب عليك تمكين الوضع الصارم في البرنامج النصي الخاص بك ، ويفضل تطبيقه في وظيفة التنفيذ الفورية المستقلة. تجنب استخدامه في السطر الأول من البرنامج النصي الذي يتسبب في بدء جميع البرامج النصية الخاصة بك في وضع صارم ، مما قد يتسبب في مشاكل مع بعض مكتبة الطرف الثالث.

غير موصى به

 'use strict' ؛ (function () {} ()) ؛

يوصي

 (function () {'use Strict' ؛} ()) ؛

رابعا. إعلان متغير

لجميع الإعلانات المتغيرة ، يجب أن نحدد var . إذا لم يتم تحديد var ، فسيتم الإبلاغ عن خطأ في الوضع الصارم ، ويجب إعلان المتغيرات في نفس النطاق مع var واحد قدر الإمكان ، ويجب فصل المتغيرات المتعددة بواسطة "،".

غير موصى به

 وظيفة myfun () {x = 5 ؛ y = 10 ؛}

غير موصى به بالكامل

 وظيفة myfun () {var x = 5 ؛ var y = 10 ؛}

يوصي

 وظيفة myfun () {var x = 5 ، y = 10 ؛}

5. الحكم المقارن باستخدام نوع الحكم

يستخدم مشغل المقارنة الدقيق === لتجنب المتاعب الناجمة عن طاقم JavaScript أثناء عملية الحكم.

إذا كنت تستخدم المشغل === ، فيجب أن يكون الطرفان في المقارنة من نفس النوع ليكونوا صالحين.

غير موصى به

 (Function (w) {'use strict' ؛ w.console.log ('0' == 0) ؛ // true w.console.log ('' == false) ؛ // true w.console.log ('1' == true) ؛ // true w.console.log (null == undefined) ؛ // vare x = w.console.log (x == 'x') ؛ // true} (window.console.log)) ؛

يوصي

 (الوظيفة (w) {'استخدم صارمًا' ؛ w.console.log ('0' === 0) ؛ // false w.console.log ('' === false) ؛ // false w.console.log ('1' === true) ؛ } ؛

6. العمليات المنطقية عند تعيين متغير

العوامل المنطقية || و && يمكن أيضًا استخدامها لإرجاع القيم المنطقية. إذا كان كائن العملية كائنًا غير بليان ، فسيتم الحكم على كل تعبير من اليسار إلى اليمين. بناءً على هذه العملية ، هناك دائمًا تعبير يتم إرجاعه في النهاية. يمكن استخدام هذا لتبسيط الكود الخاص بك عند تعيين المتغيرات.

غير موصى به

 if (! x) {if (! y) {x = 1 ؛ } آخر {x = y ؛ }}

يوصي

 x = x || ص || 1 ؛

7. شبه كولون

استخدم دائمًا فاصلة فنية لأن تعشش الكود الضمني يمكن أن يسبب مشاكل لا يمكن اكتشافها. بالطبع ، يجب علينا القضاء بشكل أساسي على هذه المشاكل [1].

الأمثلة التالية تُظهر ضرر فقدان فاصلة:

 // 1.myclass.prototype.mymethod = function () {return 42 ؛} // لا يوجد semicolon هنا (function () {}) () ؛ //2.var x = {'i': 1 ، 'j': 2} // لا يوجد فائقة هنا // أعلم أنك قد لا تكتب مثل هذا الرمز ، لكنني سأقدم مثالاً [ffversion ، ieversion] [isie] () ؛ // يموت () ؛

نتائج الخطأ

1. خطأ JavaScript - تسمى الوظيفة التي تُرجع 42 أولاً بواسطة المعلمة في الوظيفة الثانية ، ثم يتم أيضًا "تسمى الرقم 42" ، مما يؤدي إلى خطأ.

2. ثمانين مرة ستحصل على رسالة خطأ من "لا يوجد مثل هذا الممتلكات غير المحددة" ، لأن الدعوة في البيئة الحقيقية تبدو مثل: xffversion ، ieversion ().

3. تسمى دائما. نظرًا لأن نتيجة ناقص 1 في الصفيف هي نان ، فإنها لا تساوي أي شيء (بغض النظر عما إذا كانت نتائج التهوية تُرجع نان أم لا). وبالتالي فإن النتيجة النهائية هي أنه سيتم تعيين القيمة التي تم الحصول عليها بعد تنفيذ Die () إلى Things_To_EAT.

8. إعلانات الوظيفة في كتل البيان

لا تعلن أبدًا الوظائف في كتل البيانات ، وهو أمر غير قانوني في وضع صارم لـ ECMASCRIPT 5. يجب أن تكون إعلانات الوظيفة في المستوى الأعلى من النطاق. ومع ذلك ، ضمن كتلة البيان ، يمكن تحويل إعلان الوظيفة إلى تعبير دالة وتعيينه إلى متغير.

غير موصى به

 if (x) {function foo () {}}

يوصي

 if (x) {var foo = function () {} ؛}

9. لا تستخدم وظيفة eval

eval() ليس فقط إرباك السياق ولكن أيضا خطير. سيكون هناك دائمًا حل آخر لكتابة الكود الخاص بك أفضل وأكثر وضوحًا وأكثر أمانًا من هذا ، لذلك حاول عدم استخدام وظيفة eval .

10. صفيف وموضوع حرفي

1. استخدم الصفيف والكائن الحرفي بدلاً من صفيف ومُنشئ الكائن. يمكن لمركبات الصفيف ارتكاب أخطاء على معاييرها بسهولة.

غير موصى به

 // طول الصفيف 3VAR A1 = صفيف جديد (X1 ، X2 ، X3) ؛ // طول الصفيف 2VAR A2 = صفيف جديد (X1 ، X2) ؛ // إذا كان X1 رقمًا طبيعيًا ، فسيكون طوله x1 // إذا لم يكن x1 رقمًا طبيعيًا ، فسيكون طوله 1VAR A3 = جديد (x1) ؛ var a4 =

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

يوصي

 var a = [x1 ، x2 ، x3] ؛ var a2 = [x1 ، x2] ؛ var a3 = [x1] ؛ var a4 = [] ؛

2. لن يواجه مُنشئ الكائن مشاكل مماثلة ، ولكن بالنسبة لقابلية القراءة والتوحيد ، يجب أن نستخدم الحرفيات الكائنات.

غير موصى به

 var o = new Object () ؛ var o2 = new Object () ؛ o2.a = 0 ؛ o2.b = 1 ؛ o2.c = 2 ؛ o2 ['key strange'] = 3 ؛

يوصي

 var o = {} ؛ var o2 = {a: 0 ، b: 1 ، c: 2 ، 'Strange Key': 3} ؛

11.

استخدم المشغل الثلاثية لتعيين أو إرجاع البيانات. استخدم في المواقف البسيطة نسبيًا وتجنب استخدام المواقف المعقدة. لا أحد يريد استخدام 10 خطوط من المشغلين الثلاثيين لتذبذب عقولهم.

غير موصى به

 if (x === 10) {return 'face' ؛} else {return 'invalid' ؛}

يوصي

 إرجاع x === 10؟ "صالح": "غير صالح" ؛

12. للحلقة

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

غير موصى به

 لـ (var i = 0 ؛ i <arr.length ، i ++) {}

يوصي

 لـ (var i = 0 ، len = arr.length ؛ i <len ، i ++) {}

13. عمليات DOM المتكررة

عمليات DOM المتكررة ، من الضروري استخدام متغير لتلقيه ، بدلاً من تشغيل شجرة DOM بشكل متكرر ، والتي لها تأثير سيء على الأداء والرمز المرتب وسهولة الصيانة.

غير موصى به

 $ ('. mydiv'). find ('. span1'). text ('1') ؛ $ ('. mydiv'). find ('. span2'). text ('2') ؛ $ ('. mydiv').

يوصي

 var mydiv = $ ('. mydiv') ؛ mydiv.find ('. span1'). النص ('1') ؛ mydiv.find ('. span2'). النص ('2') ؛ mydiv.find ('. span3'). النص ('3') ؛ mydiv.find ('. span4'). النص (4 ') ؛

عندما يتوفر jquery .end() ، يجب أن يكون استخدام .end() .

يوصي

 $ ('. mydiv'). find ('. span1'). text ('1') .end (). find ('. span2'). text ('2') ؛ .end (). .end ().

14. مواصفات التعليق

عند وصف التعليقات ، يوصى بنمط التعليق المنسق والموحد. حاول وصف الأفكار عند كتابة التعليقات ، بدلاً من ما يفعله الرمز.

غير موصى به

 // الحصول على وظيفة Order getorderById (id) {var order ؛ // ... ترتيب العودة ؛}

يجب أن تستخدم تعليقات الطريقة بشكل موحد مع التعليقات التوضيحية على مستوى الكتلة

يوصي

 /** * احصل على بيانات تفصيلية للترتيب بناءً على معرف الطلب * param {[number]} معرف [معرف الطلب] * regurn {[order]} [تفاصيل الطلب] */وظيفة getorderbyid (id) {var order ؛ // ... ترتيب العودة ؛}

لخص

انتهى ملخص مواصفات كتابة الكود الشائعة في JavaScript بشكل أساسي. لا تزال هذه المقالة شاملة للغاية ولديها قيمة مرجعية معينة للجميع لاستخدامها أو تعلمها بعض JavaScript. آمل أن يكون ذلك مفيدًا للجميع. إذا كان لديك أي أسئلة ، فيمكنك ترك رسالة للتواصل.