راهنمای سبک JavaScript

همیشه برای تمام پروژه‌های JavaScript خود از قراردادهای کد یکسان استفاده کنید.

قراردادهای کد JavaScript

قراردادهای کد (Coding conventions) به معنایدستورالعمل‌های سبک کدنویسیاین اصول به طور کلی شامل موارد زیر هستند:

  • قوانین نام‌گذاری و اعلام متغیرها و توابع
  • قوانین استفاده از فضاهای خالی، فضای بین خطوط و توضیحات
  • عادت‌ها و اصول برنامه‌نویسی

قراردادهای کدتأمین کیفیت:

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

قراردادهای کد می‌تواند شامل قوانین نوشته شده تیم باشد یا عادت‌های شخصی شما به کدنویسی.

این صفحه توضیح می‌دهد که قراردادهای عمومی JavaScript در CodeW3C.com استفاده می‌شود.

باید به فصل بعدی

نام متغیر

در CodeW3C.com، ما از نام‌های شناسه‌ای (متغیرها و دستورالعمل‌ها) با استفاده ازحروف بزرگ و کوچک با ترتیب معکوس (camelCase) نوشته می‌شونداستفاده شوند.

تمام نام‌ها باحرفآغاز.

در پایین این صفحه، ما به طور گسترده‌تری درباره قوانین نام‌گذاری بحث خواهیم کرد.

firstName = "Bill";
lastName = "Gates";
price = 19.90;
tax = 0.20;
fullPrice = price + (price * tax);

فضای اطراف علامت‌های محاسبه

همیشه در اطراف علامت‌های محاسبه ( = + - * / ) و پس از کاما، فضای اضافی اضافه کنید:

مثال

var x = y + z;
var values = ["Volvo", "Saab",  "Fiat"];

فضاسازی کد

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

دستورالعمل

function toCelsius(fahrenheit) {
    return (5 / 9) * (fahrenheit - 32);
}

لطفاً از تاب (tab) برای فضاسازی استفاده نکنید. تفسیر tab در مرورگرهای مختلف ممکن است متفاوت باشد.

قوانین جملات

قوانین عمومی برای جملات ساده:

همیشه با علامت ویرایش (semicolon) جملات مجزا را پایان دهید:

مثال

var values = ["Volvo", "Saab",  "Fiat"];
var person = {
    firstName: "Bill",
     lastName: "Gates",
    age: 50,
    eyeColor:  "blue"
};

قوانین عمومی برای جملات پیچیده (compound):

  • کروشه باز را در انتهای خط اول بنویسید
  • از یک فاصله در جلو کروشه باز استفاده کنید
  • بازگردان به خط جدید را برای بستن کروشه‌ها بنویسید، بدون فضای پیش‌رو
  • به جای علامت ویرایش (semicolon) برای پایان جملات پیچیده استفاده نکنید

دستورالعمل:

function toCelsius(fahrenheit) {
    return (5 / 9) * (fahrenheit - 32);
}

چرخه:

for (i = 0; i < 5; i++) {
    x += i;
}

شرط:

if (time < 20) {
    greeting = "Good day";
} else {
     greeting = "Good evening";
}

قوانین شیء

قوانین عمومی برای تعریف شیء:

  • کروشه باز و نام شیء را در یک خط قرار دهید
  • در هر ویژگی و ارزش از دو علامت ویرایش و یک فاصله استفاده کنید
  • در پشت آخرین جفت ویژگی و ارزش، کاما ننویسید
  • بازگردان به خط جدید را برای بستن کروشه‌ها بنویسید، بدون فضای پیش‌رو
  • همیشه با علامت ویرایش (semicolon) تعریف شیء را پایان دهید

مثال

var person = {
    firstName: "Bill",
    lastName: "Gates",
    age: 19,
    eyeColor:  "blue"
};

می‌توانید یک شیء کوچک را در یک خط فشرده‌سازی کنید، فقط بین ویژگی‌ها از فاصله استفاده کنید، مانند این:

var person = {firstName:"Bill", lastName:"Gates", age:50, eyeColor:"blue"};

طول خط کمتر از 80

برای افزایش خوانایی، از طول هر خط بیش از 80 کاراکتر خودداری کنید.

اگر طول عبارت JavaScript بیشتر از یک خط باشد، بهترین مکان برای خط کشیدن در پس از علامت‌های عملیات یا کاما است.

مثال

document.getElementById("demo").innerHTML =
    "Hello Kitty.";

تست شخصی بکنید

قراردادهای نامگذاری

لطفاً همیشه از قراردادهای نامگذاری مشابه برای تمام کد خود استفاده کنید. به عنوان مثال:

  • نام‌های متغیر و تابع باحروف با حروف بزرگبرای نوشتن
  • متغیرهای全局 ازحروف بزرگ(ما این کار را نمی‌کنیم، اما نسبتاً شایع است)
  • متغیرهای ثابت (مثل PI) ازحروف بزرگ

آیا باید در نام‌های متغیر از آن استفاده کنیمخط تیره،حروف با حروف بزرگیاخط تیرهآیا؟

این یکی از مسائلی است که برنامه‌نویسان اغلب درباره آن بحث می‌کنند. پاسخ بستگی به کسی دارد که آن را پاسخ می‌دهد:

خط تیره در HTML و CSS:

خصوصیات HTML5 می‌توانند با استفاده از data- شروع شوند (data-quantity, data-price).

CSS از خط تیره در نام‌های property استفاده می‌کند (font-size).

Hyphens ممکن است به عنوان علامت جمع در نظر گرفته شوند. نام‌گذاری JavaScript از استفاده از خط تیره ممنوع است.

خط تیره:

بسیاری از برنامه‌نویسان از خط تیره (date_of_birth) استفاده می‌کنند، به ویژه در بانک‌های داده SQL.

خط تیره اغلب در منابع PHP استفاده می‌شود.

نامگذاری PascalCase:

برنامه‌نویسان زبان C اغلب از روش نامگذاری PascalCase استفاده می‌کنند.

حروف با حروف بزرگ (camelCase):

JavaScript خود، jQuery و سایر کتابخانه‌های JavaScript از اعداد با حروف بزرگ استفاده می‌کنند.

JavaScript نام‌گذاری نکند با استفاده از علامت دلار ($). این ممکن است منجر به برخورد نام‌های JavaScript شود.

بارگذاری JavaScript در HTML

برای بارگذاری اسکریپت‌های خارجی از زبان ساده استفاده کنید (خصوصیت type ضروری نیست):

<script src="myscript.js"></script>

به عناصر HTML دسترسی پیدا کنید

پیامدهای استفاده از استایل‌های HTML "غیر مرتب"، شاید منجر به خطاهای JavaScript شود.

این دو عبارت JavaScript نتایج مختلفی را ایجاد می‌کنند:

var obj = getElementById("Demo")
var obj = getElementById("demo")

اگر امکان دارد، لطفاً در HTML از قراردادهای نامگذاری مشابه استفاده کنید (مثل JavaScript).

دسترسی به راهنمای استایل HTMLاستفاده شوند.

نام‌های فایل

فایل‌های HTML باید با .html 扩展نام (در عوض .htmاستفاده شوند).

فایل‌های CSS باید با .css 扩展名.

فایل‌های JavaScript باید با .js 扩展名.

از نام‌های فایل کوچک استفاده کنید

بیشتر سرورهای وب (مثل Apache، Unix) به حروف بزرگ و کوچک حساس هستند:

london.jpg نمی‌تواند به عنوان London.jpg دسترسی پیدا کند.

سایر سرورهای وب (مثل IIS مایکروسافت) به حروف بزرگ و کوچک حساس نیستند:

london.jpg می‌تواند به عنوان London.jpg یا london.jpg دسترسی پیدا کند.

اگر شما از ترکیب حروف بزرگ و کوچک استفاده کنید، باید به طور دقیق و یکسان نگه داشته شوند.

اگر شما وب‌سایت خود را از سرورهای غیرحساس به سرورهای حساس به حروف بزرگ و کوچک منتقل کنید، حتی این اشتباهات کوچک ممکن است وب‌سایت شما را خراب کنند.

برای جلوگیری از این مشکلات، همیشه از نام‌های فایل کوچک استفاده کنید (اگر ممکن باشد).

عملکرد

کامپیوترها از توافقنامه‌های کد استفاده نمی‌کنند. بیشتر قوانین تأثیری بر اجرای برنامه ندارند.

حذف فاصله‌های اضافی و فضاهای خالی در اسکریپت‌های کوچک اهمیتی ندارد.

برای اسکریپت‌های در حال توسعه، باید اولویت با خوانایی قرار گیرد. باید اسکریپت‌های بزرگتر تولیدی کوچک‌تر شوند.