چطور در برنامه های خود از کد تمیز استفاده کنیم؟

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

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

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

به کلاس ها و فایل ها همچون هیدینگ ها و به متد ها همچون پاراگراف ها فکر کنید، جملات همانند عبارات های شما در برنامه‌نویسی هستند، در زیر برخی از ویژگی‌های کد تمیز آورده شده است :

• کد های تمیز متمرکز هستند - هر تابع،کلاس و یا ماژولی باید یک کار را انجام دهد، آن هم به خوبی.
• کد های تمیز باید زیبا و لطیف باشند، کدهای تمیز باید به سادگی خوانده شوند، با خواندن آنها باید لبخند بر لب هایتان نقش ببندد، بعد از خواندن کد باید بدانید دقیقا چه کاری در حال انجام است.
• مراقبت بیشتری از کدهای تمیزمیشود، برنامه نویسان باید زمانی را برای منظم سازی و ساده سازی کدها اختصاص دهند. این نوع برنامه نویسان توجه بیشتری به جزئیات دارند.
• کد های تمیز باید تست ها را گذرانده باشند، کدهایی که از مرحله آزمایش عبور نمی کند تمیز نیستند.

اما سوالی که ممکن است اکنون در ذهن شما باشد این است که به عنوان یک برنامه نویس تازه کار چطور باید کد های تمیز بنویسید؟

از تو رفتگی ها و فرمت بندی های سازگار استفاده کنید

اگر فاصله بین خطوط در کتاب ها رعایت نشود، خواندن آنها به کاری سخت تبدیل می شود. اندازه فونت و جاهایی که باید از خطوط خالی استفاده کنید از اهمیت بالایی برخوردار هستند. این موضوع دقیقا برای کدهای شما هم صادق است. برای تمیز ساختن کد و همینطور آسان تر کردن خوانایی آن مطمئن شوید که از تو رفتگی ها خطوط خالی و فرمت بندی سازگار استفاده می کنید.

در زیر نمونه مثالی خوب و بد در این مورد آورده شده است.

یک نمونه مثال خوب :

function getStudents(id) {
    if (id !== null) {
        go_and_get_the_student();
    } else {
        abort_mission();
    }
}

با نگاه کوتاهی به کد بالا به راحتی می توانید بگویید که از یک عبارت if/else در تابع استفاده شده است. آکولاد ها و تورفتگی های سازگار، مشاهده ابتدا و انتهای بلوک کد را ساده تر کرده است و در استفاده از آکولاد ها سازگاری رعایت شده است، یعنی آکولاد ابتدایی و انتهایی برای هر قسمت از کد کاملا مشخص است.

یک نمونه مثال بعد :

function getStudents(id) {
if (id !== null) {


        go_and_get_the_student();} 
    else 
    {
        abort_mission();
    }
    }

اما در مثال بالا چه چیزی مشکل دارد؟ استفاده درستی از تورفتگی ها نشده است و نمی‌توانید بگویید پایان تابع کجاست و یا شروع بلوک if/else کجاست؟ آکلاد ها گیج کننده بوده و سازگاری ندارند. فاصله بین خطوط با هم هم سازگار نیستند.

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

اما خبر خوب این است که بسیاری از محیط های برنامه نویسی امروزی برای شما این کار را به صورت خودکار انجام می دهند، حتی می توانید از پلاگین های مربوطه برای این کار استفاده کنید. برخی پلاگین ها عبارتند از :

• در VS Code از پلاگین Prettier استفاده کنید
• در Atom از پلاگین Atom Beautify استفاده کنید
• در Sublime Text از پلاگین Prettify استفاده کنید

از متغیرهای واضح و نام‌های مناسب برای متد ها استفاده کنید

در ابتدای مقاله در مورد اهمیت خوانایی کدها صحبت کردم. یک جنبه مهم درباره این موضوع نام هایی است که شما انتخاب می کنید و این مورد یکی از مواردی بود که در ابتدای راه برنامه نویسی با آن مشکل داشتم. بیایید به مثالی که در آن قاعده نام نویسی به خوبی انجام شده است، نگاهی بیاندازیم :

function changeStudentLabelText(studentId){
	const studentNameLabel = getStudentName(studentId);
}


function getStudentName(studentId){
	const student = api.getStudentById(studentId);
	return student.name;
}

کد بالا از جهات مختلفی کدی خوب در نظر گرفته می‌شود. توابع و آرگومانهای آن به صورت کاملا واضح نامگذاری شده اند، وقتی یک توسعه دهنده این کدها را می‌خواند در ذهنش کارایی آن کاملاً واضح هست. او می داند که اگر با استفاده از شناسه studentId تابع ()getStudentName را فراخوانی کند، نام دانش آموز را خواهد داشت.  داخل تابع ()getStudentName فراخوانی متغیرها و متد ها کاملاً واضح نامگذاری شدند.

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

از یک استایل خاص برای نام گذاری در کل برنامه خود استفاده کنید. از قاعده camelCase و یا under_scores بهره جوید(از یکی از آنها نه هر دو)

توابع متدها و متغیرها را با توجه به کاری که انجام می دهند، نام گذاری کنید اگر متن شما چیزی برمی گرداند از کلمه get در ابتدای نامگذاری آن استفاده کنیند

نکته : اگر کارهایی که متد شما انجام می دهد آنقدر زیاد است که نمی توانید نام درستی برای متد خود انتخاب کنید، بهتر است متد خود را به متدهای کوچکتر بشکنید، در این صورت هر کدام از متدهای به دست آمده وظیفه مشخصی را به انجام می‌رساند.

از کامنت ها در جایی که ضروری است استفاده کنید

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

کامنت های مستند

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

/**
 * Solves equations of the form a * x = b
 * @example
 * // returns 2
 * globalNS.method1(5, 10);
 * @example
 * // returns 3
 * globalNS.method(5, 15);
 * @returns {Number} Returns the value of x for the equation.
 */
globalNS.method1 = function (a, b) {
    return b / a;
};

کامنت های  Clarification 

کامنت ها Clarification توضیحاتی را برای کسانی که قصد نگهداری و توسعه کار شما را دارند، مشخص می‌کنند. مثال زیر این نوع کامنت ها را نشان می‌دهد :

/*
This function calls a third party API. Due to some issue with the API vender, the response returns "BAD REQUEST" at times. If it does, we need to retry
*/
function getImageLinks(){
	const imageLinks = makeApiCall();
	
	if(imageLinks === null){
		retryApiCall();
	} else {
		doSomeOtherStuff();
	}
}

مثال هایی از کامنتهای بد

در زیر نمونه کامنتهای آورده شده است که باید از نوشتن آن ها اجتناب کنید. آنها نه تنها ارزشی ندارند بلکه ممکن است باعث سردرگمی شوند :

کامنت تکراری که ارزشی را ایجاد نمیکند :

// this sets the students age 
function setStudentAge();

کامنت گمراه کننده :

//this sets the fullname of the student
function setLastName();

کامنت مسخره و خنده دار :

// this method is 5000 lines long but it's impossible to refactor so don't try
function reallyLongFunction();

از تکرار کدها اجتناب کنید

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

بیش از حد به تمیز کردن کدها نپردازید

برخی توسعه‌دهندگان به صورت وسواس به تمیز کردن کدها ادامه می‌دهند، مراقب باشید این کار میتواند اثر عکس داشته باشد، در واقع این کار بر بهره وری شما اثر بدی خواهد داشت. 

#کد تمیز

منبع: لرن سورس