تابع random و دستورهای break و continue در جاوا اسکریپت

قرار است هر از گاهی نگاهی به جلسات گذشته داشته باشیم و برخی از نکاتی را که نیاز به توضیح بیشتر داشته باشد در این جلسات باز کنیم. در این قسمت، تصمیم به توضیح تابع random و کلمات continue و break گرفته ایم.

تابع ()Math.random

در جلسات قبل توضیح دادیم که این تابع یک عدد تصادفی بین 0 تا 1 به ما می دهد که شامل خود 1 نمی شود اما کاربرد عملی آن را ذکر نکردیم. یکی از مواردی که در آن به تابع random نیاز پیدا می کنیم، زمانی است که بخواهیم یک عدد صحیح تصادفی تولید کنیم.

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

برای این کار باید تابع ()Math.random را با تابع ()Math.floor ادغام کنید. چند مثال از این مورد را برای شما آورده ام:

برگرداندن عددی بین 0 تا 9

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Math</h2>

<p>Math.floor(Math.random() * 10) returns a random integer between 0 and 9 (both 
included):</p>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML =
Math.floor(Math.random() * 10);
</script>

</body>
</html>

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

برگرداندن عددی بین 0 تا 99

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Math</h2>

<p>Math.floor(Math.random() * 100)) returns a random integer between 0 and 99 
(both included):</p>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML =
Math.floor(Math.random() * 100);
</script>

</body>
</html>

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

برای نمایش اعداد مختلف، به ادیتور آنلاین جاوا اسکریپت بروید و از دکمه ی "run with JS" در بالای صفحه سمت راست استفاده کنید. به این صورت هر بار کد ها از نو اجرا می شوند و عدد جدیدی برای شما تولید می شود.

برگرداندن عددی بین 1 تا 100

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Math</h2>

<p>Math.floor(Math.random() * 100) + 1) returns a random integer between 1 and 
100 (both included):</p>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML =
Math.floor(Math.random() * 100) + 1;
</script>

</body>
</html>

مشاهده ی خروجی در ادیتور آنلاین جاوا اسکریپت

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

تابع اول: این تابع همیشه یک عدد تصادفی صحیح بین min و max به ما می دهد (شامل خود min می شود اما شامل max نمی شود)

function getRndInteger(min, max) {
  return Math.floor(Math.random() * (max - min) ) + min;
}

تابع دوم: این تابع همیشه یک عدد تصادفی صحیح بین min و max به ما می دهد (شامل هر دو می شود)

function getRndInteger(min, max) {
  return Math.floor(Math.random() * (max - min + 1) ) + min;
}

مثال استفاده:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Math.random()</h2>

<p>Every time you click the button, getRndInteger(min, max) returns a random number between 1 and 10 (both included):</p>

<button onclick="document.getElementById('demo').innerHTML = getRndInteger(1,10)">Click Me</button>

<p id="demo"></p>

<script>
function getRndInteger(min, max) {
  return Math.floor(Math.random() * (max - min + 1) ) + min;
}
</script>

</body>
</html>

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

دستور Break

دستور break به حلقه می گوید: از حلقه بیرون بیا!

در جلسات قبل با این دستور آشنا هستید؛ در جلسه ی آشنایی با دستور switch از آن برای خروج از یک case استفاده می کردیم اما می توانیم از همین دستور برای خروج از یک حلقه نیز استفاده کنیم.

بنابراین دستور break باعث می شود اجرای کدها درون حلقه متوقف شده و برنامه از حلقه خارج شود. جاوا اسکریپت نیز به سراغ اجرای کدهای بعدی می رود (البته اگر بعد از حلقه کدی باشد). مثال:

<!DOCTYPE html>
<html>
<body>

<p>A loop with a break.</p>

<p id="demo"></p>

<script>
var text = "";
var i;
for (i = 0; i < 10; i++) {
  if (i === 3) { break; }
  text += "The number is " + i + "<br>";
}
document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>

خروجی این حلقه به شکل زیر است:

The number is 0
The number is 1
The number is 2

اما در حالت عادی باید تا 10 ادامه پیدا می کرد چرا که شرط حلقه (کمتر بودن i از 10) هنوز برقرار است، پس چه اتفاقی افتاده است؟ ما به حلقه گفته ایم اگر به گردش i = 3 رسیدی از حلقه خارج شو! این دستور نسبت به شرط حلقه بی اعتنا است، به همین دلیل چنین اتفاقی رخ داده است.

دستور continue

دستور continue به حلقه می گوید: یک گردش را رد کن و به گردش بعدی برو.

به طور مثال به حلقه ی زیر می گوییم در دوری که مقدار i برابر با 3 می شود، کد های حلقه را اجرا نکن و مستقیما به دور بعدی برو (یعنی دور i = 4):

<!DOCTYPE html>
<html>
<body>

<p>A loop which will skip the step where i = 3.</p>

<p id="demo"></p>

<script>
var text = "";
var i;
for (i = 0; i < 10; i++) {
  if (i === 3) { continue; }
  text += "The number is " + i + "<br>";
}
document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>

خروجی این کد به شکل زیر است:

The number is 0
The number is 1
The number is 2
The number is 4
The number is 5
The number is 6
The number is 7
The number is 8
The number is 9

می بینید که عدد 3 در نتایج بالا وجود ندارد.

امیدوارم متوجه تفاوت های break و continue شده باشید. در مورد توابع random نیز مطمئن باشید که هنگام برنامه نویسی به کارتان می آیند بنابراین بهتر است آن ها را جایی نگه داری کنید (مثلا در یک فایل txt).

نگاهی به گذشته: تابع random و دستورات continue و break

تابع ()Math.random

دستور Break

دستور continue