بررسی متدهای تعامل با کاربر در جاوااسکریپت : alert , prompt, confirm

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

تابع alert

این تابع رو توی آموزش‌های قبلی دیدیم این یک پیغام نشون میده و منتظر کاربر می‌مونه تا «OK» رو فشار بده برای مثال:

alert("Hello");

این پنجره‌ی کوچیک همراه با پیغام یک modal window هست کلمه «modal» به معنی اینه که بازدیدکننده نمی‌تونه با بقیه‌ی صفحه تعامل کنه، دکمه‌های دیگه رو بزنه و یا غیره، تا زمانی که با پنجره بازشده کارش تموم شده باشه. تو این مورد خاص -- تا زمانی که دکمه‌ی «OK» رو بزنه

تابع prompt

تابع prompt دو پارامتر داره:

result = prompt(title, default);

این یه modal window با یه متن نشون میده، که یه فیلد ورودی هم داخلش هست که کاربر می‌تونه داخلش یه متنی وارد کنه و دو تا دکمه OK و Cancel داره

title : پیغامی که به کاربر نشون داده میشه

default: پارامتری اختیاری که مقدار اولیه برای فیلد ورودی رو تنظیم میکنه

کاربر می‌تونه یه چیزی تایپ کنه توی فیلد ورودی prompt و دکمه OK رو بزنه بعدش ما به متنی که وارد کرده از طریق متغیر result می‌تونیم دسترسی داشته باشیم و اگه Cancel یا دکمه Esc رو بزنه متغیر result مقدارش null می‌شه. برای نمونه :

let age = prompt('How old are you?', 100);  
alert(`You are ${age} years old!`); // You are 100 years old!

تابع confirm

شکل نوشتنش اینجوریه:

result = confirm(question);

تابع confirm یه modal window با یه سوال نشون میده و دو تا دکمه Ok و Cancel هم داره

نتیجه‌اش هم اگه کاربر Ok بزنه True میشه در غیر این صورت False

برای مثال:

let isBoss = confirm("Are you the boss?");   
alert( isBoss ); // true if OK is pressed

خلاصه

توی این قسمت ما ۳ تا از تابع های مخصوص مرورگر که برای تعامل با کاربر هست رو توضیح دادیم:‌

• تابع alert یک پیغام نشون کاربر میده
• تابع prompt یک پیغام نشون کاربر میده و یک فیلد ورودی هم داره تا کاربر توش یک متن وارد کنه اگر Ok بزنه متن رو برمی‌گردونه توی نتیجه و در غیر این‌صورت null
• تابع confirm یک پیغام نشون کاربر میده و تا زمانی که دکمه Ok یا Cancel رو نزنه صبر می‌کنه اگه Ok رو بزنه true و اگه Esc/Cancel رو بزنه false رو برمی‌گردونه

همه این توابع modal هستن: باعث متوقف شدن اجرای اسکریپت میشن و اجازه نمیدن که کاربر با بقیه قسمت های صفحه کار کنه تا وقتی که کارشون با این پنجره‌ها تموم بشه

دو تا محدودیت توی توابع بالا وجود داره : - محل modal window رو مرورگر مشخص می‌کنه و معمولا وسط صفحه هست - شکل نمایش پنجره‌ای هم باز بستگی به مرورگر داره که چطور نشون بده و ما نمی‌تونیم ویرایشش کنیم

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

منبع: javascript.info