javascriptLogical operatorsعملگرهای منطقی در جاوااسکریپت
با &&، || و ! در جاوااسکریپت شرطهای ترکیبی بسازید؛ اجرای کوتاهمدار، مقدار خروجی و خطر جایگزینکردن صفر با || را در مثال ببینید.
مفهوم به زبان ساده
وقتی نمایش یک دکمه به چند شرط وابسته است، عملگر منطقی آنها را ترکیب میکند. اگر هر دو شرط لازم باشند از && استفاده میکنیم؛ اگر برقرار بودن یکی کافی باشد || مناسب است. ! مقدار را به بولی تبدیل و وارونه میکند. برای مثال !isClosed یعنی بسته نبودن، به شرط آنکه معنای isClosed در مدل روشن باشد.
عملگرهای && و || از چپ به راست بررسی میکنند و همیشه دو طرف را اجرا نمیکنند. && با رسیدن به نخستین مقدار falsy متوقف میشود؛ || با رسیدن به نخستین مقدار truthy متوقف میشود. این رفتار «کوتاهمدار» است. در نمونه، چون isSaved برابر false است، تابع announce اصلاً اجرا نمیشود. پس اجرای یک تابع در طرف راست به نتیجهٔ سمت چپ وابسته خواهد بود.
این دو عملگر الزاماً true یا false برنمیگردانند؛ یکی از مقدارهای عملوندها را برمیگردانند. برای همین '' || 'مهمان' متن پیشفرض میدهد. اما 0 || 10 هم ۱۰ میشود، چون صفر falsy است؛ اگر صفر مقدار معتبر شماست، این پیشفرض اشتباه خواهد بود. در چنین قراردادی ممکن است ?? مناسب باشد که فقط null و undefined را نبود مقدار میداند. برای شرطهای چندبخشی از پرانتز و نامهای خوانا استفاده کنید؛ کوتاهتر بودن کد بهتنهایی فهم آن را بهتر نمیکند.
کجا به کار میآید؟
- فعالکردن دکمه فقط وقتی فرم معتبر است و ذخیره در جریان نیست
- انتخاب متن نمایشی پیشفرض با توجه به معنای نبود مقدار
از تعریف تا یک مثال واقعی
const hasTitle = true;
const isSaving = false;
console.log(hasTitle && !isSaving);
console.log('' || 'مهمان');
console.log(0 || 10);
console.log(0 ?? 10);
function announce() {
console.log('اجرا شد');
return true;
}
const isSaved = false;
console.log(isSaved && announce());
true مهمان 10 0 false
این مثال چطور کار میکند؟
هر دو شرط hasTitle و !isSaving درستاند؛ دکمه میتواند فعال باشد.
رشتهٔ خالی falsy است و || متن مهمان را انتخاب میکند.
|| صفر را کنار میگذارد، ولی ?? صفر معتبر را حفظ میکند.
چون isSaved مقدار false دارد، announce فراخوانی نمیشود و پیام اجرا شد چاپ نمیشود.
اشتباه رایج
|| را پیشفرض عمومی همهٔ دادهها ندانید؛ صفر، false و رشتهٔ خالی را نیز کنار میگذارد. همچنین از && انتظار خروجی بولیِ همیشگی نداشته باشید.
این را به خاطر بسپارید
معنای truthy و falsy و اجرای کوتاهمدار را پیش از ترکیب شرطها مشخص کنید.