صفحه اصلی >> بلاگ >> عملگر علامت سوال (؟) در جاوا اسکریپت چگونه کار می کند

عملگر علامت سوال (؟) در جاوا اسکریپت چگونه کار می کند

دسته:جاوااسکریپت تاریخ انتشار: 16 فوریه 2021 ایمان رضایی

عملگر شرطی یا علامت سوال که با ؟ نمایش داده می شود ، یکی از قدرتمندترین ویژگی ها در جاوا اسکریپت است. عملگر ? در دستورات شرطی استفاده می شود ، و هنگامی که با : ترکیب شود ، می تواند به عنوان یک جایگزین جمع و جور برای دستورات if ... else عمل کند.

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

 

سه کاربرد اصلی برای علامت سوال (؟) در جاوا اسکریپت:

  1. اپراتور سه گانه (Ternary Operator)
  2. زنجیره اختیاری (Optional Chaining)
  3. تلفیق پوچ (Nullish Coalescing)

 

به جزئیات هر یک از این موارد خواهیم پرداخت. ابتدا با رایج ترین روشی که عملگر ؟ مورد استفاده قرار می گیرد - به عنوان یک عملگر سه گانه.

 

  1. عملگر سه گانه

اصطلاح سه گانه به معنای مرکب از سه ماده یا قسمت است. عملگر ؟ عملگر سه گانه نامیده می شود زیرا ، برخلاف سایر عملگرها مانند دقیقا برابر (===) یا باقیمانده (٪) ، این تنها عملگر است كه سه عملوند را می گیرد.

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

 

 

اپراتور سه گانه در واقع میانبر دستورات if ... else است.

بیایید یک اپراتور سه گانه را با عبارت if طولانی تر مقایسه کنیم:

 

در اینجا ، اپراتور سه گانه فقط یک خط کد را اشغال می کند ، در حالی که if...else جای هفت خط را می گیرد.

استفاده از اپراتور سه گانه بسیار موثرتر است ، درست است؟

 

 

  1. زنجیره اختیاری

در سال 2020 ، ویژگی جدید بسیار جذاب معروف به زنجیره ای اختیاری معرفی شد.

برای درک نحوه کار کردن ، این سناریو را تصور کنید.

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

 

یک خطای معمول - TypeError: خواندن ویژگی " salary " تعریف نشده امکان پذیر نیست

 

با تشکر از زنجیره اختیاری ، شما فقط می توانید یک ؟ بین نام ویژگی و ویژگی بعدی قرار دهید.

 

با این کار ، به جای ایجاد یک خطای زشت ، فقط undefined برمی گردد.

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

 

 

  1. تلفیق پوچ

در بعضی موارد ، شما باید یک مقدار پیش فرض را برای نام یا مقدار خاصیت گمشده تعیین کنید.

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

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

به این ترتیب ، وقتی برنامه داده ها را نمایش می دهد ، تصویر پیش فرض برای شهرهای بدون تصویر وجود خواهد داشت.

با استفاده از عملگر || می توانید این کار را انجام دهید ، معروف به عملگر منطقی یا OR:

 

اما اگر از || برای ارائه یک مقدار پیش فرض  استفاده می کنید ، اگر برخی از مقادیر را قابل استفاده بدانید (به عنوان مثال '' یا 0) ممکن است با رفتارهای غیرمنتظره ای روبرو شوید.

سناریویی را در نظر بگیرید که متغیر دارای مقدار 0 یا یک رشته خالی باشد. اگر از (||) استفاده کنیم ، به عنوان تعریف نشده یا NULL در نظر گرفته می شود و مقداری پیش فرض را که در نظر گرفته ایم را برمی گرداند.

به جای عملگر OR منطقی (||) ، می توانید از علامت سوال دوگانه (؟؟) یا Nullish Coalescing استفاده کنید.

بیایید با یک مثال یاد بگیریم.

const value1 = 0 || 'default string';

console.log(value1);

 

 

const value2 = '' || 1000;

console.log(value2);

 

در اینجا ، ما "0" و "default string" را در مقدار متغیر value1 داریم. اگر مقدار آن را در کنسول وارد کنیم ، "default string" به دست ما می رسد که عجیب است. به جای رشته پیش فرض ، باید 0 دریافت کنیم ، زیرا صفر تعریف نشده یا خالی است. بنابراین ، "||" در اینجا درست کار نمی کند.

به همین ترتیب ، با متغیرvalue2 نیز همینطور است.

خروجی برای "||"

 

const value1 = 0 ?? 'default string';
console.log(value1);

 

 
const value2 = '' ?? 1000;
console.log(value2);

 

با Nullish Coalescing

 

اما اگر "||" را با "??" جایگزین کنیم ، 0 و یک رشته خالی بدست می آوریم ، که باعث می شود خیلی جالب باشد.

خروجی برای " ?? "

 

Nullish Coalescing دقیقاً مانند عملگر منطقی OR کار می کند ، با این تفاوت که وقتی مقدار سمت چپ تعریف نشده یا خالی باشد ، مقدار سمت راست را خواهید گرفت.

به عبارت دیگر، ?? فقط مقادیر undefined و null را مجاز می داند ، نه رشته های خالی ('') یا 0 را.

 

 

نتیجه

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


n0
n42

برای ثبت نظر باید وارد سایت شوید یا ثبت نام نمایید.


نظر شما با موفقیت در سیستم ثبت گردید.