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

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

یکی از راه های جلوگیری از این امر، ساده کردن کد است. این می تواند به بهبود خوانایی، کارایی و قابلیت نگهداری آن کمک کند.

در این مقاله ده روش برای ساده‌سازی کد جاوا اسکریپت، خوانایی و نگهداری آن بیشتر بحث خواهد شد. بیایید بررسی کنیم!

از توابع Arrow استفاده کنید

استفاده از توابع Arrow یک راه کوتاه برای ایجاد توابع در جاوا اسکریپت است. آنها کد شما را با کوتاه شدن کد مورد نیاز برای تعریف یک تابع ساده می کنند.

به عنوان مثال، به جای استفاده از کلمه کلیدی تابع برای تعریف تابعی مانند این:

function greeings(name){ 
console.log(Hello, ${name}!);
}

شما می توانید از یک تابع Arrow مانند این استفاده کنید:

const greeting = name => console.log(`Hello, ${name}!`);

جدا از اینکه توابع Arrow  دارای سینتکس کوتاه‌تری هستند، می‌توانند کد شما را مختصرتر، خواندن آسان‌تر و کمتر مستعد خطا کنند. این باعث می شود که انتخاب بهتری نسبت به استفاده از کلمه کلیدی تابع باشد.

از نام های متغیر توصیفی استفاده کنید

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

به عنوان مثال، به جای استفاده از:

const x = 10;

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

const numberOfItems = 10;

numberOfItems بسیار توصیفی تر از x است و به شما (یا دیگر توسعه دهندگانی که به کد شما نگاه می کنند) کمک می کند تا بفهمید چه کاری انجام می دهد.

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

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

به عنوان مثال، به جای اصلاح یک آرایه در زیر:

const numbers = [1, 2, 3];
numbers.push(4);

می توانید از عملگر spread برای ایجاد یک آرایه جدید استفاده کنید:

const numbers = [1, 2, 3];
const newNumbers = [...numbers, 4];

استفاده از عملگر spread به شما کمک می کند از اضافه نویسی غیرمنتظره جلوگیری کنید و کد شما را قابل پیش بینی تر می کند.

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

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

از کدنویسی تودرتو اجتناب کنید

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

برای مثال، به جای تودرتو کردن عباراتif:

if (condition1) {
  if (condition2) {
    // code
  }
}

از return ستفاده کنید:

if (condition1) {
  return;
}
if (condition2) {
  return;
}
// code

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

return زودهنگام همچنین می تواند با جلوگیری از محاسبات غیر ضروری، کارایی کد شما را افزایش دهد.

از پارامترهای پیش فرض استفاده کنید

استفاده از پارامترهای پیش‌فرض به شما امکان می‌دهد یک مقدار پیش‌فرض برای یک پارامتر تابع مشخص کنید. این می تواند کد شما را با کاهش تعداد عبارات شرطی که باید بنویسید ساده کند.

به عنوان مثال، به جای استفاده از منطق شرطی برای تنظیم یک مقدار پیش فرض:

function greet(name) {
  if (!name) {
    name = 'World';
  }
  console.log(`Hello, ${name}!`);
}

می توانید از یک پارامتر پیش فرض استفاده کنید:

function greet(name = 'World') {
  console.log(`Hello, ${name}!`);
}

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

از Destructuring استفاده کنید

Destructuring به شما این امکان را می دهد که مقادیر را از آرایه ها و اشیاء استخراج کرده و آنها را به متغیرها اختصاص دهید. انجام این کار می تواند کد شما را مختصرتر و خواناتر کند.

به عنوان مثال، به جای دسترسی مستقیم به خصوصیات شیء مانند زیر:

const person = { name: 'John', age: 30 };
const name = person.name;
const age = person.age;

می توانید از Destructuring استفاده کنید:

const { name, age } = { name: 'John', age: 30 };

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

از Promises استفاده کنید

Promises به شما این امکان را می دهد که کدهای ناهمزمان را به روشی قابل خواندن و قابل پیش بینی تر بنویسید. آنها کد شما را با اجتناب از نیاز به پاسخگویی ساده می کنند و شما را قادر می سازند تا عملیات ناهمزمان را با هم زنجیره کنید.

به عنوان مثال، به‌جای تودرتو کردن callbacks:

function getUserData(userId, callback) {
  getUser(userId, function(user) {
    getPosts(user, function(posts) {
      getComments(posts, function(comments) {
        callback(comments);
      });
    });
  });
}

می توانید از پرومیس هایی مانند این استفاده کنید:

function getUserData(userId) {
  return getUser(userId)
    .then(user => getPosts(user))
    .then(posts => getComments(posts));
}

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

از متد های آرایه استفاده کنید

جاوا اسکریپت متد های داخلی زیادی برای دستکاری آرایه ها دارد، مانند map، filter و forEach. استفاده از این متد ها می تواند کد شما را مختصرتر و خواناتر کند.

به عنوان مثال، به جای استفاده از یک حلقه for برای تکرار روی یک آرایه:

const numbers = [1, 2, 3];
for (let i = 0; i < numbers.length; i++) {
  console.log(numbers[i]);
}

می توانید از متد forEach استفاده کنید:

const numbers = [1, 2, 3];
numbers.forEach(number => console.log(number));

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

از متد های آبجکت استفاده کنید

اشیاء جاوا اسکریپت انواع متدهای داخلی مانند Object.keys، Object.values و Object.entries را ارائه می دهند. این متد ها می توانند کد شما را با کاهش نیاز به حلقه ها و شرطی ها ساده تر کنند.

به عنوان مثال، به جای استفاده از یک حلقه for برای تکرار روی یک شی:

const person = { name: 'John', age: 30 };
for (const key in person) {
  console.log(`${key}: ${person[key]}`);
}

می توانید از متد Object.entries استفاده کنید:

const person = { name: 'John', age: 30 };
Object.entries(person).forEach(([key, value]) => console.log(`${key}: ${value}`));

درست مانند متد های آرایه، استفاده از متدهای شی می‌تواند کد شما را مختصر، خوانا و مدولار کند.

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

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

به عنوان مثال می توان به React برای ساخت رابط های کاربری، Lodash برای برنامه نویسی تابعی و Moment.js برای کار با تاریخ و زمان اشاره کرد.

شما ممکن است استفاده از یک چارچوب/کتابخانه را در موارد زیر در نظر بگیرید:

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

از سوی دیگر، ممکن است بخواهید از استفاده از چارچوب/کتابخانه نیز اجتناب کنید زمانی که:

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

نتیجه

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

چه نکات دیگری را پیشنهاد می کنید؟ فراموش نکنید اگر این مقاله را مفید یافتید به اشتراک بگذارید.