آشنایی با ۱۰ قاعده نام گذاری در جاوا اسکریپت

پیروی کردن از استانداردهای نام گذاری باعث می‌شود تا کدهای شما خواناتر شده و برای افراد مختلف و حتی خود شما درک پذیری آسانتری داشته باشد. با این وجود همه توسعه دهندگان از این قواعد پیروی نمی‌کنند و دلیل آن نیز بیشتر ندانستن این قواعد است. به همین دلیل است که در برخی از کدها، نامگذاری متغیرها، توابع، کلاس‌ها و... را بسیار غیر منطقی می‌بینیم و دقیقا نمی‌دانیم که چرا توسعه‌دهنده‌ای چنین نام‌هایی را انتخاب می‌کند. چنین کدهایی در گیت‌هاب کم نبوده و مطالعه کردن آن‌ها سرگیجه عجیبی برای انسان درست می‌کند.

در این مقاله اختصاصی از وبسایت راکت قصد داریم شما را با ۱۰ قاعده نامگذاری در جاوا اسکریپت آشنا کنیم که باعث می‌شود تا بهترین رویکردها را در ادامه مسیر توسعه اپلیکیشن‌های جاوا اسکریپتی خود انتخاب کرده و کدهای ارزشمندتری را بنویسید.

قاعده اول: نامگذاری متغیرها در جاوا اسکریپت

متغیرها در بیشتر زبان‌های برنامه نویسی Case-Sensitive هستند و در دنیای جاوا اسکریپت نیز به همین شکل است. حروف بزرگ و کوچک از همدیگر جدا بوده و مقادیر مختلفی را می‌توانند در خود قرار بدهند. برای مثال به قطعه کد پایین نگاه کنید. شما سه متغیر را مشاهده می‌کنید که به لحاظ معنایی همگی شبیه همدیگر هستند اما از آنجایی که به صورت متفاوتی از حروف در آن‌ها استفاده شده می‌توانید ببینید که مقادیر مختلفی در آن‌ها قرار می‌گیرد.

var DogName = 'Scooby-Doo';
var dogName = 'Droopy';
var DOGNAME = 'Odie';
console.log(DogName); // "Scooby-Doo"
console.log(dogName); // "Droopy"
console.log(DOGNAME); // "Odie"

با این حال استانداردترین روشی که در دنیای متغیرهای جاوا اسکریپت برای نامگذاری انتخاب شده است روش camelCase است. روشی که در آن اولین حرف کلمه دوم یک متغیر به صورت بزرگ نوشته می‌شود و بقیه حروف به صورت کوچک نوشته خواهند شد. زمانی که شما از این استاندارد استفاده کنید می‌توانید مطمئن شوید که در پروژه‌های‌تان متغیرهایی با نام‌های یکسان اما با کوچکی و بزرگی متفاوت حروف پیاده سازی نخواهید کرد. به مثال زیر توجه کنید.

// bad
var dogname = 'Droopy'; 
// bad
var dog_name = 'Droopy'; 
// bad
var DOGNAME = ‘Droopy’; 
// bad
var DOG_NAME = 'Droopy'; 
// good
var dogName = 'Droopy';

همچنین نام متغیر به عنوان یک استاندارد همگانی، باید مقداری که داخل آن قرار می‌گیرد را توصیف بکند. از این جهت اگر شما بخواهید نام یک سگ را در یک متغیر قرار دهید باید اسمی را برای متغیرتان قرار بدهید که دقیقا مقدار مقصود را توصیف بکند. برای مثال dogName انتخاب بسیار خوبی است.

قاعده دوم: نامگذاری برای مقادیر Boolean در جاوا اسکریپت

زمانی که در جاوا اسکریپت به متغیرهای بولین می‌رسیم باید کلمه is یا has را به عنوان پیشوند به متغیرها اضافه کنیم. برای مثال اگر بخواهیم مقدار true یا false را به یک سگی که صاحب دارد یا نه اضافه کنیم می‌توانیم از متغیر hasOwner استفاده کنیم. همانطور که می‌بینید قاعده cameCase نیز در اینجا رعایت شده است. برای مثال‌های بیشتر به قطعه کد زیر نگاه کنید.

// bad
var bark = false;
// good
var isBark = false;
// bad
var ideal = true;
// good
var areIdeal = true;
// bad
var owner = true;
// good
var hasOwner = true;

قاعده سوم: نامگذاری برای توابع در جاوا اسکریپت

برای نام گذاری توابع در جاوا اسکریپت درست مانند قاعده اول پیش می‌رویم، یعنی همان camelCase اما یک نکته مهم در توابع وجود دارد و آن این است که لطفا تنها از نام یا اسم (به عنوان کلمه) استفاده نکنید بلکه چون تابع یک کار خاص را انجام می‌دهد، در کنار اسم به آن یک فعل نیز اضافه کنید. برای مثال اگر قصد دارید نام یک سگ را چاپ برگردانید به جای استفاده از name برای تابع، از getName استفاده کنید. به مثال زیر توجه کنید.

// bad
function name(dogName, ownerName) { 
  return '${dogName} ${ownerName}';
}

// good
function getName(dogName, ownerName) { 
  return '${dogName} ${ownerName}';
}

قاعده چهارم: نامگذاری برای ثابت‌ها در جاوا اسکریپت

در دنیای جاوا اسکریپت همه چیز Case-Sensitive است از جمله ثابت‌ها. با این حال در جاوا اسکریپت برای نامگذاری ثابت‌ها ما آن‌ها را به صورت uppercase می‌نویسیم که همان حروف بزرگ است. از آنجایی که آن‌ها تغییر ناپذیر هستند باید به این شکل در کدهای‌مان آن‌ها را نشان دهیم. به مثال زیر توجه کنید:

var LEG = 4;
var TAIL = 1;
var MOVABLE = LEG + TAIL;

اگر ثابت‌های شما بیشتر از یک کلمه باشند می‌توانیم آن‌ها را به صورت Snake Case بنویسیم. یعنی بین کلمات مختلف آندرلاین قرار دهیم. به مثال زیر توجه کنید.

var DAYS_UNTIL_TOMORROW = 1;

قاعده پنجم: نامگذاری برای کلاس‌ها در جاوا اسکریپت

در بسیاری از جهات، نامگذاری کلاس‌ها با توابع در جاوا اسکریپت فرق چندانی نمی‌کند اما یک تفاوت مهم در شیوه نوشتن وجود دارد و آن این است که برای نامگذاری کلاس‌ها ما از روش PascalCase استفاده می‌کنیم. یعنی در آن، اولین حرف هر کلمه باید بزرگ نوشته شود. به مثال زیر توجه کنید.

class DogCartoon { 
  constructor(dogName, ownerName) { 
    this.dogName = dogName; 
    this.ownerName = ownerName; 
  }
}

var cartoon = new DogCartoon('Scooby-Doo', 'Shaggy');

قاعده ششم: نامگذاری برای کامپوننت‌ها در جاوا اسکریپت

در دنیای فرانت-اند ما به صورت گسترده‌ای از کامپوننت‌ها استفاده می‌کنیم. با وجود آنکه کامپوننت‌ها در داخل DOM استفاده می‌شوند ما برای تعریف کردن‌شان به همان شکل قاعده پنجم یعنی کلاس‌ها با آن‌ها رفتار می‌کنیم. یعنی همان روش PascalCase که در زیر می‌توانید نمونه‌ای از آن‌ را شاهد باشید.

// bad
function dogCartoon(roles) { 
  return ( 
    < div > 
      < span > Dog Name: { roles.dogName } < /span> 
      < span > Owner Name: { roles.ownerName } < /span> 
    < /div> 
  );
} 

// good
function DogCartoon(roles) { 
  return ( 
    < div > 
      < span > Dog Name: { roles.dogName } < /span> 
      < span > Owner Name: { roles.ownerName } < /span> 
    < /div> 
  );
}

قاعده هفتم: نامگذاری برای متدها در جاوا اسکریپت

اگرچه ساختار متدها با توابع در جاوا اسکریپت متفاوت از همدیگر هستند ما برای نامگذاری‌شان از قاعده مشترکی استفاده می‌کنیم که همان camelCase است. همچنین برای معنا بخشیدن به آن‌ها از افعال نیز کمک می‌گیریم. به مثال زیر توجه کنید.

class DogCartoon {
  constructor(dogName, ownerName) { 
    this.dogName = dogName; 
    this.ownerName = ownerName; 
  }

  getName() { 
    return '${this.dogName} ${this.ownerName}'; 
  }
}

var cartoon= new DogCartoon('Scooby-Doo', 'Shaggy');

console.log(cartoon.getName());
// "Scooby-Doo Shaggy"

قاعده هشتم: نامگذاری برای توابع Private در جاوا اسکریپت

در زبانی مانند PHP ما به صورت گسترده‌ای از آندرسکور ( _ ) استفاده می‌کنیم که برای تعریف متغیرها، توابع و متدها کاربردی است. اما در دنیای جاوا اسکریپت این علامت تنها برای یادآوری اینکه فلان متغیر یا تابع Private است مورد استفاده قرار می‌گیرد. برای همین اگر شما یک متغیر یا تابع پرایوت دارید و قصد دارید این موضوع را بیان کنید می‌توانید یک _ را به اول نام آن اضافه کنید. به مثال زیر توجه کنید.

class DogCartoon { 
  constructor(dogName, ownerName) { 
    this.dogName = dogName; 
    this.ownerName = ownerName; 
    this.name = _toonName(dogName, ownerName); 
  } 
  _toonName(dogName, ownerName) { 
    return `${dogName} ${ownerName}`; 
  } 
}

var cartoon = new DodCartoon('Scooby-Doo', 'Shaggy'); 

// good
var name = cartoon.name;
console.log(name);
// "Scooby-Doo Shaggy" 

// bad
name =cartoon._toonName(cartoon.dogName, cartoon.ownerName);
console.log(name);
// "Scooby-Doo Shaggy"

قاعده نهم: نامگذاری برای متغیرهای همگانی یا Global در جاوا اسکریپت

برای متغیرهای همگانی در جاوا اسکریپت هیچ استاندارد خاصی برای نامگذاری وجود ندارد. اما به عنوان یک استاندارد نه چندان ثابت شده پیشنهاد می‌شود از حالت camelCase برای متغیرهای mutable و از حالت uppercase برای immutable استفاده کنید.

قاعده دهم: نامگذاری برای فایل‌ها

بیشتر وب سرورها (آپاچی و یونیکس) در فرایند مدیریت فایل‌ها Case-Sensitive هستند به همین دلیل dog.jpg با Dog.jpg متفاوت قلم داد می‌شود. با این حال برخی دیگر از این وب سرورها مانند وب سرور مایکروسافت به این نکته توجهی نمی‌کنند و این دو فایل را به عنوان یک فایل می‌شناسند. از این جهت که مشکلی برای فایل‌ها و مدیریت‌شان به وجود نیاید، همواره از حروف کوچک برای نامگذاری فایل‌های‌تان استفاده کنید.

در پایان

در این مقاله اختصاصی از راکت ما ۱۰ قاعده نامگذاری را برای شما توضیح دادیم که به عنوان یک توسعه دهنده بسیار مهم است تا آن ها را یاد بگیرید و در پروژه‌های خود از آن استفاده کنید. اگر به یادگیری بهتر و عمیق‌تر جاوا اسکریپت علاقه مندید ما یک مجموعه دوره آموزشی تحت عنوان «مسیر یادگیری جاوا اسکریپت» تولید کرده‌ایم که می‌توانید از آن برای تقویت جنبه‌های مختلف توسعه اپلیکیشن‌های جاوا اسکریپتی استفاده کنید.