جایگزینی گزاره سه تایی جاوا اسکریپت با if-else — راهنمای کاربردی

همزمان با یادگیری برنامه‌نویسی با مواردی مواجه می‌شویم که با خود فکر می‌کنیم می‌توانستیم این کد را بهتر از این هم بنویسیم. فرصت بهبود کدنویسی که «بازسازی» (refactoring) نامیده می‌شود، همواره وجود دارد. انجام این بازسازی نشانه‌ای از بلوغ یافتن مهارت‌های برنامه‌نویسی به حساب می‌آید. متغیرها و گزاره‌های if-else دو مورد از مفاهیم برنامه‌نویسی مهم هستند و از این رو بازسازی گزاره‌های if-else موارد مناسبی برای تمرین بازسازی محسوب می‌شود. در این مقاله به بررسی روش جایگزینی گزاره سه تایی جاوا اسکریپت با if-else به عنوان یک رویکرد مناسب بازنویسی می‌پردازیم.

در مثال زیر یک انتساب متغیر canVote وجود دارد که بر اساس یک شرط مقدار true یا false خواهد داشت:

1const age = 19;
2if(age >= 18) {
3   const canVote = true;
4} else {
5   const canVote = false;
6}

این نوع از بلوک کد به قدر کافی ساده است، اما با بررسی بیشتر، نوعی افزونگی در آن مشاهده می‌شود. ما دو گزاره انتساب برای canVote داریم. در واقع کل هدف گزاره if-ese انتساب یک مقدار به canVote است. برای بازسازی چنین مواردی می‌توانیم از عملگر سه‌تایی :? جاوا اسکریپت استفاده کنیم.

عملگر سه‌تایی چیست؟

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

فیلم آموزش جاوا اسکریپت JavaScript – جامع و کاربردی در فرادرس

کلیک کنید

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

1const age = 19;
2const canVote = (age >= 18) ? true : false;

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

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

(condition)? positive assignment: negative assignment

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

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

1// step 1: write the ternary syntax
2const canVote = () ? : ;
3// step 2: fill in the condition and assignments
4const canVote = (age >= 18) ? true : false;

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

چرا باید از عملگر سه‌تایی استفاده کنیم؟

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

برخی برنامه نویسان در برابر استفاده از عملگر سه‌تایی جبهه می‌گیرند، چون فکر می‌کنند که گزاره‌های if-else خوانایی آسان‌تری دارند. در واقع مغز ما کلمات if و else را سریع‌تر از بررسی و استخراج نمادهای : ? () از یک خط تحلیل می‌کند. با این حال زمانی که گزاره‌های if-else در یک چارچوب بزرگ‌تر برنامه بررسی می‌شوند، صرفه‌جویی زیادی که در حجم کد از عملگر سه‌تایی ناشی می‌شود چشمگیر است.

به علاوه اگر بخواهیم نام canVote را تغییر دهیم در زمان استفاده از گزاره if-else این کار را باید در دو جا انجام دهیم، اما با بهره‌گیری از عملگر سه‌تایی این کار تنها در یک محل انجام می‌شود. زمانی که در استفاده از عملگر سه‌تایی تجربه بیشتری کسب کنید، می‌توانید از آن در تابع‌ها برای ساده‌سازی گزاره‌های بازگشتی نیز به بهره بگیرید.

1function canVote(age) {
2   return (age >= 18) ? true : false;
3}

کد فوق را می‌توانستیم بیش از این هم ساده‌سازی کنیم تا صرفاً ارزیابی age >= 18 را بازگشت دهد، اما به منظور حفظ انسجام کد چنین نوشتیم.

فیلم مجموعه آموزش جاوا اسکریپت JavaScript – مقدماتی تا پیشرفته در فرادرس

کلیک کنید

اگر این مطلب برای شما مفید بوده است آموزش‌های زیر نیز به شما پیشنهاد می‌شوند:

• مجموعه آموزش‌های JavaScript (جاوا اسکریپت)
• مجموعه آموزش‌های برنامه‌‌نویسی
• آموزش JavaScript ES6 (جاوا اسکریپت)
• گزاره های شرطی در جاوا اسکریپت – راهنمای جامع
• آموزش جاوا اسکریپت — مجموعه مقالات جامع وبلاگ فرادرس

==