▎شاخه‌بندی شرطی: if و '?'

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

▎دستور "if"

دستور if(...) یک شرط را در پرانتز ارزیابی می‌کند و اگر نتیجه درست بود، یک بلوک کد را اجرا می‌کند.

به عنوان مثال:

در مثال بالا، شرط یک بررسی ساده برابری (year == 2015) است، اما می‌تواند بسیار پیچیده‌تر باشد.

اگر بخواهیم چندین دستور را اجرا کنیم، باید کد خود را داخل آکولادها {} قرار دهیم:

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

▎تبدیل بولی

دستور if (...) عبارت موجود در پرانتز را ارزیابی کرده و نتیجه را به یک مقدار بولی تبدیل می‌کند.

بیایید قوانین تبدیل را از فصل تبدیل نوع‌ها یادآوری کنیم:

یک عدد 0، یک رشته خالی ""، null، undefined و NaN همگی به false تبدیل می‌شوند. به همین دلیل به آن‌ها "مقادیر کاذب" (falsy) گفته می‌شود.

سایر مقادیر به true تبدیل می‌شوند، بنابراین به آن‌ها "مقادیر حقیقی" (truthy) گفته می‌شود.

بنابراین، کد زیر هرگز اجرا نخواهد شد:

و در داخل این شرط – همیشه اجرا خواهد شد:

ما همچنین می‌توانیم یک مقدار بولی از پیش ارزیابی شده را به if پاس دهیم، مانند این:

▎بخش "else"

دستور if ممکن است شامل یک بلوک else اختیاری باشد. این بلوک زمانی اجرا می‌شود که شرط نادرست باشد.

به عنوان مثال:

▎چندین شرط "else if"

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

به عنوان مثال:

در کد بالا، جاوااسکریپت ابتدا بررسی می‌کند که آیا year < 2015. اگر این نادرست باشد، به شرط بعدی year > 2015 می‌رود. اگر آن هم نادرست باشد، آخرین هشدار را نشان می‌دهد.

می‌توان بلوک‌های else if بیشتری داشت. آخرین else اختیاری است.

▎عملگر شرطی ‘?’

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

به عنوان مثال:

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

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

سینتکس آن به صورت زیر است:

شرط ارزیابی می‌شود: اگر درست باشد، value1 بازگشت داده می‌شود، در غیر این صورت – value2.

به عنوان مثال:

از نظر فنی، می‌توانیم پرانتزها را در اطراف age > 18 حذف کنیم. عملگر علامت سوال دارای اولویت پایینی است، بنابراین بعد از مقایسه > اجرا می‌شود.

این مثال همان کار را انجام خواهد داد:

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

❕ توجه داشته باشید:

در مثال بالا، شما می‌توانید از استفاده از عملگر علامت سوال اجتناب کنید زیرا خود مقایسه true/false برمی‌گرداند:

▎چندگانه ’?’

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

به عنوان مثال:

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

1. اولین علامت سوال بررسی می‌کند که آیا age < 3.

2. اگر درست باشد – 'سلام، بچه!' را بازمی‌گرداند. در غیر این صورت، ادامه می‌دهد به عبارت بعد از دو نقطه “:”، و age < 18 را بررسی می‌کند.

3. اگر آن هم درست باشد – 'سلام!' را بازمی‌گرداند. در غیر این صورت، ادامه می‌دهد به عبارت بعدی بعد از دو نقطه “:”، و age < 100 را بررسی می‌کند.

4. اگر آن هم درست باشد – 'درود!' را بازمی‌گرداند. در غیر این صورت، ادامه می‌دهد به عبارت بعد از آخرین دو نقطه “:”، و 'چه سنی غیرمعمول!' را بازمی‌گرداند.

این نحوه نمایش با استفاده از if..else است:

▎استفاده غیرسنتی از ’?’

گاهی اوقات علامت سوال ? به عنوان جایگزینی برای if استفاده می‌شود:

بسته به اینکه آیا company == 'Netscape'، یکی از دو عبارت اول یا دوم بعد از ? اجرا شده و یک هشدار نشان داده می‌شود.

ما در اینجا نتیجه‌ای را به یک متغیر اختصاص نمی‌دهیم. در عوض، کدهای مختلفی را بسته به شرط اجرا می‌کنیم.

استفاده از عملگر علامت سوال به این روش توصیه نمی‌شود.

این نوشتار کوتاه‌تر از دستور معادل if است که برای برخی برنامه‌نویسان جذاب است. اما خوانایی آن کمتر است.

▎شاخه‌بندی شرطی: if و '?'

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

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

▎چگونه در جاوااسکریپت عبارات شرطی بنویسیم

▎مقدمه

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

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

عبارات شرطی یک عمل خاص را بر اساس نتایج یک نتیجه درست یا نادرست اجرا می‌کنند.

چند مثال از عبارات شرطی جاوااسکریپت که ممکن است ببینید شامل موارد زیر است:

• بررسی موقعیت کاربر و نمایش زبان صحیح بر اساس کشور.

• ارسال فرم در زمان ارسال، یا نمایش هشدارها در کنار فیلدهای الزامی خالی.

• باز کردن یک منوی کشویی در رویداد کلیک، یا بستن منوی کشویی اگر قبلاً باز باشد.

• نمایش وب‌سایت فروشنده الکل اگر کاربر بالای سن قانونی نوشیدن باشد.

• نمایش فرم رزرو برای یک هتل اما نه اگر هتل رزرو شده باشد.

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

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

▎عبارت If

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

عبارت if با کلیدواژه if نوشته می‌شود، که پس از آن یک شرط در پرانتز قرار دارد و کد قابل اجرا در بین آکولادها قرار می‌گیرد. به طور خلاصه، می‌توان آن را به صورت if () {} نوشت.

در اینجا یک بررسی طولانی‌تر از عبارت if پایه‌ای داریم.

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

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

ما یک موجودی حساب ۵۰۰ داریم و می‌خواهیم یک جفت شلوار جین به قیمت ۴۰ خریداری کنیم. با استفاده از اپراتور کمتر یا برابر با، می‌توانیم بررسی کنیم که آیا قیمت شلوار جین کمتر یا برابر با مقدار موجودی ما است. از آنجا که jeans <= balance به true ارزیابی می‌شود، شرط برقرار است و بلوک کد اجرا خواهد شد.

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

این مثال هیچ خروجی ندارد، زیرا phone <= balance به false ارزیابی می‌شود. بلوک کد به سادگی نادیده گرفته می‌شود و برنامه به خط بعدی ادامه می‌دهد.

▎عبارت Else

با عبارات if، ما تنها کدی را اجرا می‌کنیم که وقتی یک عبارت به true ارزیابی شود، اما اغلب ما می‌خواهیم چیزی دیگر اتفاق بیفتد اگر شرط ناموفق باشد.

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

عبارت else بعد از عبارت if نوشته می‌شود و هیچ شرطی در پرانتز ندارد. در اینجا نحو یک عبارت if...else پایه‌ای آورده شده است.

با استفاده از همان مثال بالا، می‌توانیم پیامی اضافه کنیم تا اگر موجودی حساب کافی نباشد نمایش داده شود.

از آنجا که شرط if موفق نشد، کد به آنچه در عبارت else وجود دارد منتقل می‌شود.

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

▎عبارت Else If

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

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

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

شما می‌توانید به تعداد لازم عبارت else if داشته باشید. در صورت وجود بسیاری از عبارات else if، ممکن است عبارت switch برای خوانایی بیشتر ترجیح داده شود.

به عنوان مثالی برای چندین عبارت else if، می‌توانیم یک برنامه نمره‌دهی ایجاد کنیم که بر اساس نمره‌ای از ۱۰۰، یک نمره حروفی را خروجی دهد.

الزامات این برنامه به شرح زیر است:

• نمره ۹۰ و بالاتر A است.

• نمره ۸۰ تا ۸۹ B است.

• نمره ۷۰ تا ۷۹ C است.

• نمره ۶۰ تا ۶۹ D است.

• نمره ۵۹ یا کمتر F است.

در زیر یک مجموعه ساده از عبارات if، else و else if ایجاد خواهیم کرد و آن‌ها را در برابر یک نمره مشخص آزمایش خواهیم کرد.

در مثال ما، ابتدا بالاترین نمره را بررسی می‌کنیم که باید بزرگ‌تر یا برابر با ۹۰ باشد. پس از آن، عبارات else if نمرات بزرگ‌تر از ۸۰، ۷۰ و ۶۰ را بررسی می‌کنند تا به default else برای نمره مردود برسند.

اگرچه مقدار نمره ما ۸۷ به طور تکنیکی برای C، D و F نیز درست است، اما عبارات در اولین مورد موفق متوقف می‌شوند. بنابراین، خروجی ما B خواهد بود که اولین تطابق است.

▎اپراتور سه‌گانه

اپراتور سه‌گانه، که به عنوان اپراتور شرطی نیز شناخته می‌شود، به عنوان کوتاه‌نویسی برای یک عبارت if...else استفاده می‌شود.

یک اپراتور سه‌گانه با نحو یک علامت سؤال (?) که با یک دو نقطه (:) دنبال می‌شود نوشته می‌شود، همان‌طور که در زیر نشان داده شده است.

در عبارت بالا، شرط ابتدا نوشته می‌شود و سپس علامت سؤال قرار می‌گیرد. اولین عبارت در صورت درست بودن اجرا خواهد شد و عبارت دوم در صورت نادرست بودن اجرا می‌شود. این ساختار بسیار شبیه به عبارت if...else است، با نحوی فشرده‌تر.

در این مثال، ما یک برنامه ایجاد خواهیم کرد که بررسی کند آیا کاربر ۲۱ سال یا بیشتر دارد. اگر داشته باشد، "شما می‌توانید وارد شوید" را در کنسول چاپ می‌کند. اگر نداشته باشد، "شما نمی‌توانید وارد شوید." را در کنسول چاپ می‌کند.

از آنجا که سن کاربر کمتر از ۲۱ بود، پیام شکست به کنسول خروجی داده شد. معادل if...else این مورد "شما می‌توانید وارد شوید." در عبارت if و "شما نمی‌توانید وارد شوید." در عبارت else خواهد بود.

▎نتیجه‌گیری

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

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

^NO CONTEXT HUMANS^

@sut_tw

مقاله: مدیریت NaN در جاوااسکریپت

من معتقدم که ما، توسعه‌دهندگان، همگی لحظات گیج‌کننده‌ای را در حین توسعه در جاوااسکریپت تجربه کرده‌ایم. مدیریت NaN یکی از این موارد است.

MDN تعریف می‌کند که NaN یک ویژگی جهانی است که نمایانگر "Not-a-Number" (عدد نیست) می‌باشد. با استفاده از عملگر typeof، می‌توانیم بررسی کنیم که NaN از نوع داده اولیه Number است.

به‌طور معمول، ما باید با NaN زمانی روبرو شویم که توابع ریاضی شکست بخورند یا هنگام تلاش برای تجزیه یک عدد، مانند مثال‌های زیر.

خوب، تا اینجا همه چیز خوب به نظر می‌رسد. اما چگونه می‌توانیم بدانیم که آیا یک مقدار برگشتی NaN است؟ همانطور که قبلاً دیدیم، typeof NaN از نوع Number است، اما typeof 0 نیز از نوع Number است. این بدان معناست که عملگر typeof به ما نمی‌گوید که آیا مقداری که بررسی می‌کنیم NaN است یا نه.

پس اگر نمی‌توانیم از عملگر typeof استفاده کنیم، چه کار دیگری می‌توانیم انجام دهیم تا بررسی کنیم که آیا یک مقدار NaN است؟ پاسخ به این سوال ممکن است بسیار ساده به نظر برسد. چرا مقدار برگشتی را با NaN مقایسه نکنیم؟ اگر NaN باشد، نتیجه true خواهیم داشت و در غیر این صورت false خواهیم داشت و می‌دانیم که NaN نیست. بیایید امتحان کنیم:

صبر کنید. چه؟ اما… ما می‌دانیم که Math.round('a') نتیجه NaN را برمی‌گرداند. چگونه می‌تواند NaN == NaN نتیجه false بدهد؟

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

بله، می‌دانم که این موضوع بسیار گیج‌کننده است، اما با من همراه باشید. در مثال بالا، roundNum NaN است زیرا وقتی roundNum را برای برابری با خودش مقایسه می‌کنیم، نتیجه false است. همانطور که قبلاً یاد گرفتیم، این تنها زمانی اتفاق می‌افتد که با NaN روبرو باشیم. در حالت دوم، roundNum2 NaN نیست، زیرا وقتی با خودش مقایسه می‌شود، نتیجه true است.

isNaN()

به نظر می‌رسد جاوااسکریپت یک تابع دارد که به ما کمک می‌کند تا زمانی که یک مقدار NaN است را شناسایی کنیم. خوب، بیایید امتحان کنیم!

شاید دوباره گیج شده‌اید. 'lalala' و ' ' هر دو رشته هستند. چرا مورد اول به عنوان NaN در نظر گرفته می‌شود و دومی نه؟ یک نکته‌ای که باید به آن توجه کنید این است که بسته به نوع ورودی، تابع سعی خواهد کرد تا از طریق تبدیل نوع (coercion) استفاده کند و سپس بررسی کند که آیا مقدار تبدیل شده NaN است یا خیر. به نوعی شبیه به این است:

همچنین به یاد داشته باشید که شما در حال بررسی این هستید که آیا یک مقدار خاص NaN است یا نه، که به سادگی به معنای "این مقدار عدد نیست" نیست. بلکه به طور خاص به معنای "این مقدار یک عدد Not-a-Number طبق IEEE-754 است".

Number.isNaN()

این یک ویژگی نسبتاً جدید است که در ECMAScript 2015 (ES6) مشخص شده و یک تفاوت عمده با isNaN() معمولی دارد: آرگومان به طور اجباری تبدیل نمی‌شود. این بدان معناست که این تابع اکنون بررسی می‌کند که آیا مقدار ارائه‌شده (به همان شکل) NaN است یا نه.

آنچه در اینجا اتفاق می‌افتد این است که در مورد اول، تابع isNaN() سعی می‌کند 'lalala' را به عدد تبدیل کند. در نتیجه یک محاسبه ناموفق رخ می‌دهد و NaN برمی‌گردد و سپس بررسی می‌شود که آیا برابر با NaN است یا نه، که نتیجه true را برمی‌گرداند.

با این حال، در مورد دوم، تابع Number.isNaN() سعی نمی‌کند پارامتر را به طور اجباری به عدد تبدیل کند. در عوض، فقط بررسی می‌کند که آیا مقدار ورودی NaN است یا نه.

نتیجه‌گیری

این موضوع می‌تواند بسیار گیج‌کننده باشد، اما به طور کلی به یاد داشته باشید که NaN یک مقدار از نوع Number است؛ معمولاً زمانی ظاهر می‌شود که محاسبات متدهای ریاضی شکست بخورند و مقایسه آن با خودش false باشد (NaN == NaN = false). تابعی به نام isNaN() وجود دارد که پارامتر را قبل از مقایسه با NaN به عدد تبدیل می‌کند. برای داشتن یک راه‌حل مطمئن‌تر، ES6 تابع Number.isNaN() را معرفی کرد که بررسی می‌کند آیا پارامتر NaN است یا نه بدون اینکه از طریق هرگونه تبدیل اجباری عبور کند.

در نهایت، اگر بخواهید بررسی کنید که آیا یک مقدار "عدد نیست" به جای NaN، کافیست از typeof variable !== 'number' استفاده کنید.

امیدوارم این مطلب مفید بوده باشد. کدنویسی خوش بگذره! :)

▎تابع isNaN()

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

▎امتحان کنید

نحو (Syntax)

پارامترها

• value: مقداری که باید آزمایش شود.

مقدار بازگشتی

• true اگر مقدار داده‌شده پس از تبدیل به عدد، NaN باشد؛ در غیر این صورت، false.

توضیحات

isNaN() یک ویژگی تابعی از شیء جهانی است.

برای مقادیر عددی، isNaN() بررسی می‌کند که آیا عدد برابر با NaN است یا خیر. وقتی آرگومان تابع isNaN() از نوع Number نباشد، ابتدا مقدار به عدد تبدیل می‌شود و سپس مقدار حاصل با NaN مقایسه می‌شود.

این رفتار isNaN() برای آرگومان‌های غیر عددی می‌تواند گیج‌کننده باشد! به عنوان مثال، یک رشته خالی به 0 تبدیل می‌شود، در حالی که یک بولین به 0 یا 1 تبدیل می‌شود؛ هر دو مقدار به طور شهودی "عدد نیستند"، اما به NaN ارزیابی نمی‌شوند، بنابراین isNaN() false را برمی‌گرداند. بنابراین، isNaN() نه تنها به سوال "آیا ورودی برابر با مقدار NaN است" پاسخ می‌دهد و نه به سوال "آیا ورودی عدد نیست".

Number.isNaN() راهی مطمئن‌تر برای آزمایش اینکه آیا یک مقدار برابر با NaN است یا خیر، می‌باشد. به‌علاوه، عبارت x !== x نیز می‌تواند استفاده شود و هیچ‌یک از این راه‌حل‌ها تحت تأثیر مثبت‌های کاذب که isNaN() جهانی را غیرقابل اعتماد می‌کند، قرار نمی‌گیرد. برای بررسی اینکه آیا یک مقدار عدد است یا نه، از typeof x === "number" استفاده کنید.

تابع isNaN() به سوال "آیا ورودی از نظر عملکردی معادل NaN است زمانی که در یک زمینه عددی استفاده می‌شود" پاسخ می‌دهد. اگر isNaN(x) false را برگرداند، می‌توانید از x در یک عبارت ریاضی به عنوان یک عدد معتبر که NaN نیست استفاده کنید. اگر isNaN(x) true را برگرداند، x به NaN تبدیل خواهد شد و بیشتر عبارات ریاضی نتیجه NaN را برمی‌گردانند (زیرا NaN گسترش می‌یابد). شما می‌توانید از این موضوع استفاده کنید تا بررسی کنید آیا یک آرگومان برای یک تابع از نظر ریاضی قابل پردازش است (قابل استفاده "مانند" یک عدد) و مقادیر غیر عددی را با پرتاب خطا، ارائه یک مقدار پیش‌فرض و غیره مدیریت کنید. به این ترتیب، می‌توانید تابعی داشته باشید که از تمام تنوعی که جاوااسکریپت ارائه می‌دهد با تبدیل‌های ضمنی مقادیر بسته به زمینه استفاده کند.

نکته: عملگر + هم عملیات جمع عددی و هم الحاق رشته‌ای را انجام می‌دهد. بنابراین، حتی اگر isNaN() برای هر دو عملوند false را برگرداند، عملگر + ممکن است هنوز یک رشته را برگرداند، زیرا به عنوان یک عملگر ریاضی استفاده نمی‌شود. به عنوان مثال، isNaN("1") false را برمی‌گرداند، اما "1" + 1 برابر با "11" خواهد بود. برای اطمینان از اینکه با اعداد کار می‌کنید، مقدار را به عدد تبدیل کرده و از Number.isNaN() برای آزمایش نتیجه استفاده کنید.

▎مثال

به یاد داشته باشید که isNaN() برای مقادیر که برابر با NaN نیستند اما همچنین عدد هم نیستند true را برمی‌گرداند:

برای نامگذاری بهتر کلاس های css این مقاله می‌تونه کمک کنه ❤️

بیانیه "switch"

بیانیه switch می‌تواند جایگزین چندین بررسی if شود.

این یک روش توصیفی‌تر برای مقایسه یک مقدار با چندین حالت مختلف ارائه می‌دهد.

سینتکس

بیانیه switch شامل یک یا چند بلوک case و یک بلوک default اختیاری است.

به این صورت به نظر می‌رسد:

مقدار x برای برابری سخت (strict equality) با مقدار اولین case (یعنی value1) بررسی می‌شود، سپس با دومین (value2) و به همین ترتیب.

اگر برابری پیدا شود، switch شروع به اجرای کد از case مربوطه می‌کند تا نزدیک‌ترین break (یا تا پایان switch).

اگر هیچ case مطابقت نداشته باشد، کد default اجرا می‌شود (اگر وجود داشته باشد).

یک مثال

مثالی از switch (کد اجرایی هایلایت شده است):

در اینجا switch شروع به مقایسه a از اولین حالت که 3 است می‌کند. تطابق ناموفق است.

سپس 4. این یک تطابق است، بنابراین اجرا از case 4 آغاز می‌شود تا نزدیک‌ترین break.

اگر break وجود نداشته باشد، اجرا با case بعدی بدون هیچ چک دیگری ادامه می‌یابد.

مثالی بدون break:

در مثال بالا ما سه alert متوالی را خواهیم دید:

❕هر بیانیه‌ای می‌تواند آرگومان switch/case باشد.

هم switch و هم case اجازه می‌دهند که عبارات دلخواه استفاده شوند.

برای مثال:

در اینجا +a برابر با 1 است که با b + 1 در case مقایسه می‌شود و کد مربوطه اجرا می‌شود.

گروه‌بندی "case"

چندین حالت case که کد مشترکی دارند می‌توانند گروه‌بندی شوند.

برای مثال، اگر بخواهیم همان کد برای case 3 و case 5 اجرا شود:

اکنون هم 3 و هم 5 همان پیام را نشان می‌دهند.

توانایی "گروه‌بندی" حالات نتیجه جانبی نحوه کار switch/case بدون break است. در اینجا اجرای case 3 از خط (*) شروع می‌شود و از case 5 عبور می‌کند، زیرا break وجود ندارد.

نوع اهمیت دارد

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

برای مثال، بیایید کد زیر را در نظر بگیریم:

1. برای 0 و 1، اولین alert اجرا می‌شود.

2. برای 2، alert دوم اجرا می‌شود.

3. اما برای 3، نتیجه prompt یک رشته "3" است که به عدد 3 به طور سخت === برابر نیست. بنابراین ما یک کد مرده در case 3 داریم! گزینه default اجرا خواهد شد.

▎عملگرهای منطقی

در جاوا اسکریپت چهار عملگر منطقی وجود دارد: || (یا)، && (و)، ! (نفی). در اینجا به بررسی سه مورد اول می‌پردازیم و عملگر ?? (تجمیع نال) در مقاله بعدی بررسی خواهد شد.

اگرچه این عملگرها "منطقی" نامیده می‌شوند، اما می‌توانند به مقادیر از هر نوعی اعمال شوند و نتیجه آن‌ها نیز می‌تواند از هر نوعی باشد.

بیایید جزئیات را بررسی کنیم.

▎|| (یا)

عملگر "یا" با دو علامت عمودی نمایش داده می‌شود:

در برنامه‌نویسی کلاسیک، عملگر منطقی OR معمولاً برای کار با مقادیر بولی طراحی شده است. اگر هر یک از آرگومان‌ها درست (true) باشد، نتیجه درست (true) خواهد بود و در غیر این صورت، نادرست (false) خواهد بود.

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

چهار ترکیب منطقی ممکن وجود دارد:

همانطور که مشاهده می‌کنید، نتیجه همیشه درست است مگر اینکه هر دو عملوند نادرست باشند.

اگر یک عملوند بولی نباشد، برای ارزیابی به بولی تبدیل می‌شود.

برای مثال، عدد 1 به عنوان درست (true) و عدد 0 به عنوان نادرست (false) در نظر گرفته می‌شود:

بیشتر اوقات، OR || در یک دستور if برای آزمایش اینکه آیا هر یک از شرایط داده شده درست است استفاده می‌شود.

به عنوان مثال:

ما می‌توانیم شرایط بیشتری را نیز اضافه کنیم:

عملگر "یا" || اولین مقدار درست را پیدا می‌کند.

منطق توصیف شده در بالا تا حدی کلاسیک است. حالا بیایید ویژگی‌های "اضافی" جاوا اسکریپت را بررسی کنیم.

الگوریتم گسترش‌یافته به شرح زیر عمل می‌کند:

با توجه به چندین مقدار OR شده:

عملگر OR || کارهای زیر را انجام می‌دهد:

1. عملوندها را از چپ به راست ارزیابی می‌کند.

2. برای هر عملوند، آن را به بولی تبدیل می‌کند. اگر نتیجه درست باشد، متوقف شده و مقدار اصلی آن عملوند را برمی‌گرداند.

3. اگر همه عملوندها ارزیابی شدند (یعنی همه نادرست بودند)، آخرین عملوند را برمی‌گرداند.

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

برای مثال:

این منجر به برخی استفاده‌های جالب در مقایسه با یک OR صرفاً کلاسیک و مخصوص بولی می‌شود.

1. دریافت اولین مقدار درست از یک لیست از متغیرها یا عبارات.

برای مثال، ما متغیرهای firstName، lastName و nickName داریم که همه اختیاری هستند (یعنی ممکن است undefined یا دارای مقادیر نادرست باشند).

بیایید از OR || استفاده کنیم تا یکی از آن‌ها که دارای داده است را انتخاب کنیم و آن را نمایش دهیم (یا "Anonymous" اگر هیچ‌کدام تنظیم نشده باشند):

اگر همه متغیرها نادرست بودند، "Anonymous" نمایش داده می‌شود.

2. ارزیابی کوتاه‌مدت.

یکی دیگر از ویژگی‌های عملگر OR || ارزیابی کوتاه‌مدت است.

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

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

در مثال زیر، فقط پیام دوم چاپ می‌شود:

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

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

▎&& (و)

عملگر AND با دو علامت نمایش داده می‌شود:

در برنامه‌نویسی کلاسیک، AND زمانی درست است که هر دو عملوند درست باشند و در غیر این صورت نادرست است:

مثالی با if:

همانند OR، هر مقداری به عنوان عملوند AND مجاز است:

عملگر AND && اولین مقدار را پیدا می‌کند.

با توجه به چندین مقدار AND شده:

عملگر AND && کارهای زیر را انجام می‌دهد:

1. عملوندها را از چپ به راست ارزیابی می‌کند.

2. برای هر عملوند، آن را به بولی تبدیل می‌کند. اگر نتیجه نادرست باشد، متوقف شده و مقدار اصلی آن عملوند را برمی‌گرداند.

3. اگر همه عملوندها ارزیابی شدند (یعنی همه درست بودند)، آخرین عملوند را برمی‌گرداند.

به عبارت دیگر، AND اولین مقدار نادرست یا آخرین مقدار را اگر هیچ مقدار نادرستی پیدا نشود، برمی‌گرداند.

قوانین فوق مشابه OR هستند. تفاوت این است که AND اولین مقدار نادرست را برمی‌گرداند در حالی که OR اولین مقدار درست را برمی‌گرداند.

مثال‌ها:

ما همچنین می‌توانیم چندین مقدار را به صورت پی‌درپی پاس دهیم. ببینید چگونه اولین مقدار نادرست برمی‌گردد:

وقتی همه مقادیر درست باشند، آخرین مقدار برگردانده می‌شود:

▎اولویت عملگرهای منطقی

اولویت عملگر AND && از OR || بالاتر است.

بنابراین کد a && b c && a به طور اساسی مشابه با این است که فرض کنیم عبارات AND در پرانتز قرار دارند: (a && b) (c && d).

⚠️ از جایگزینی if با || یا & خودداری کنید

گاهی اوقات، افراد از عملگر AND && به عنوان یک "روش کوتاه‌تر برای نوشتن if" استفاده می‌کنند.

برای مثال:

عملی که در سمت راست && وجود دارد فقط در صورتی اجرا می‌شود که ارزیابی به آن برسد. یعنی، تنها اگر (x > 0) درست باشد.

بنابراین، ما اساساً یک معادل برای:

داریم.

اگرچه نسخه‌ای که با && نوشته شده کوتاه‌تر به نظر می‌رسد، استفاده از if واضح‌تر است و معمولاً کمی خواناتر است. بنابراین توصیه می‌شود که از هر ساختار برای هدف خود استفاده کنید: از if برای موارد شرطی و از && برای عملگر AND استفاده کنید.

▎! NOT

عملگر NOT منطقی با علامت تعجب ! نمایش داده می‌شود.

سینتکس آن بسیار ساده است:

این عملگر یک آرگومان را می‌پذیرد و کارهای زیر را انجام می‌دهد:

1. عملوند را به نوع بولی تبدیل می‌کند: true/false.

2. مقدار معکوس را برمی‌گرداند.

برای مثال:

یک دو بار NOT !! گاهی برای تبدیل یک مقدار به نوع بولی استفاده می‌شود:

یعنی، اولین NOT مقدار را به بولی تبدیل کرده و معکوس آن را برمی‌گرداند و دومین NOT دوباره آن را معکوس می‌کند. در نهایت، ما یک تبدیل ساده از مقدار به بولی داریم.

یک روش کمی طولانی‌تر برای انجام همین کار، استفاده از تابع داخلی Boolean است:

اولویت عملگر NOT ! بالاترین اولویت را در بین تمام عملگرهای منطقی دارد، بنابراین همیشه اول از همه اجرا می‌شود، قبل از && یا ||.

از فردا مقالات html و css ارسال میشه ❤️