7 تکته برای حرفه ای شدن در جاوااسکریپت

سلام,

توی این مطلب قصد داریم 7 نکته برای حرفه ای تر شدن کد های جاوااسکریپت شما معرفی کنیم. ام منظورمون از حرفه ای تر شدن چیه ؟ 

بعضی وفتها کد نویسی حرفه ای یعنی انجام یک کار خاص با حداقل کد . و بعضی وقت ها هم یعنی انجام یک عمل خاص با بهینه ترین روش (از نظر مصرف منابع سخت افزاری) . 

به هر حال در این مطلب نکات مربوط به کد نویسی بهینه در جاوااسکریپت برای شما آورده شده : 

1. متغیر های بدون استفاده را حذف کنید

خیلی پیش میاد که متغیری رو تعریف می کنید و بعد از اینکه از اون استفاده کردید دیگه نقشی توی ادامه ی برنامه ندارند . همانطور که می دونید متغیر ها داخل حافظه RAM دستگاه ذخیره می شن پس اگه شما اون متغیر ها رو خالی کنید مقداری از حافظه ی دستگاه رو بازیابی کردید:

var mystring = "the best programming weblog is webcoder!" ;
 /*                
some action with mystring 
*/ 
mystring = null ;

همانطور که دیدید مقدار متغیر رو برابر null قرار دادیم که باعث بهینه شدن برنامه میشه . البته دقت کنید که کارتون رو با این متغیر به صورت کامل تمام کرده باشید.

2. کوتاه کردن شرط ها 

اول تکه کد زیر رو ببینید:

if (user)
{ 
   login() ;
}

تکه کد بالا رو می تونید به شکل زیر بنویسید :

user && login() ;

3. خطایابی جاوااسکریپت با کنسول

اگه شما هم مثل بیشتر برنامه نویسان دیگه جاوااسکریپت از کنسول مرورگر برای خطایابی استفاده می کنید. می تونید از فرم زیر که بسیار کاربردی است استفاده کنید.

console.log({ err1 , err2 , err3 , err4 })

نتیجه کد بالا در داخل کنسولتون به شکل خیلی تمیز نمایش داده میشه :

{

   err1 ,

   err2 ,

   err3 ,

   err4

}

4. کد های خودتون رو قبل از بارگذاری فشرده کنید

بعد از اینکه برنامه خودتون رو تموم کردید و خواستید که برنامه ی خودتون رو آپلود کنید حتما اون رو فشرده کنید. البته این توصیه تنها برای کد های جاوااسکریپت نیست بلکه برای html و css هم کاربرد داره . ابزار های آنلاین زیادی برای اینکار وجود داره . یکی از اون ها که خودم ازش استفاده می کنم javascript-minifier هستش .

5. از " !! " استفاده کنید

از این اپراتور به خوبی می تونید استفاده کنید. کاری که این اپراتور می کنه به ازای مقادیری که متغیر تون داره مقدار true یا false رو برمی گردونه . در حقیقت اگر متغیر شما مقادیر ( 0 و "" و NaN و تعریف نشده) داشته باشه مقدار false برمی گردونه و اگر شرایط درست باشه مقدار true  رو بر می گردونه .

var realnumber = 20 ;
console.log(!!realnumber)
// نتیجه برابر true

var nothing = 0;
console.log(!!nothing)
//نتیجه برابر false

 

6. بارگذاری فایل های جاوااسکریپت رو همزمان کنید

موضوع اینکه که هر موقع مرورگر به یک تگ script می رسه که اون به یک فایل خارجی اشاره می کنه . ساختن بقیه ی عناصر صفحه رو متوقف می کنه تا اینکه اون فایل جاوااسکریپت دانلود بشه . به همین خاطر می بینید که توی بیشتر سایت ها اینجور فایل رو در انتهای سند html قرار می دن تا مانع بارگذاری صفحه نشه . 

کاری که شما می تونید انجام بدید اینکه از async و defer استفاده کنید.

کاری که async انجام میده اینه که فایل های جاوااسکریپت رو بصورت همزمان دانلود میکنه . 

کار defer اینه که تگ اسکریپت شما هر جا که باشه بعد از پایان لود شدن صفحه بارگذاری میشن.

دقت که اگه از async استفاده کنید ممکنه در داخل فایل اسکریپت عنصری از صفحه خواسته بشه که هنوز ساخته نشده پس دقت کنید. 

<script src="index.js" async></script>

<script src="index.js" defer></script>

7. حتما از CDN ها برای بارگذاری استفاده کنید

استفاده از cdn ها سرعت باگذاری صفحه ها به مقدار قابل توجهی بالا می بره . هم چنین شما می تونید مقداری از پهنای باند خودتون رو هم حفظ کنید.