آموزش جاوا اسکریپت 3


آموزش جاوا اسکریپت 3

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

مثال:

<!DOCTYPE html>
<html>
<body>
<p id=”demo”></p>
<script>
var x = 9.656;
document.getElementById(“demo”).innerHTML =
x.toFixed(0) + “<br>” +
x.toFixed(2) + “<br>” +
x.toFixed(4) + “<br>” +
x.toFixed(6);
</script>

</body>
</html>

خروجی مثال بالا:

10
9.66
9.6560
9.656000

نکته:این تابع هم عدد را رند می کند هم تعداد رقم اعشار را مشخص می کند.

 

تفاوت تابع toPrecision با toFixed:

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

مثال:

<!DOCTYPE html>
<html>
<body>

<p id=”demo”></p>

<script>
var x = 9.656;
document.getElementById(“demo”).innerHTML =
x.toPrecision() + “<br>” +
x.toPrecision(2) + “<br>” +
x.toPrecision(4) + “<br>” +
x.toPrecision(6);
</script>

</body>
</html>

خروجی:

9.656
9.7
9.656
9.65600

برای تبدیل اعداد اعشاری به اعداد صحیح بدون آن که اعداد را رند کنیم باید از تابع parseInt استفاده کنیم:

مثال:

<!DOCTYPE html>
<html>
<body>

<p id=”demo”></p>

<script>
document.getElementById(“demo”).innerHTML =
parseInt(“10”) + “<br>” +
parseInt(“10.33”) + “<br>” +
parseInt(“10 6”) + “<br>” +
parseInt(“10 years”) + “<br>” +
parseInt(“years 10”);
</script>

</body>
</html>

خروجی:

10
10
10
10
NaN

نکته: خروجی آخرین عدد به خاطر این که به جای عدد رشته وارد شده است NaN است.

 

برای ایجاد یک عدد تصادفی از تابع random در کلاس Math استفاده می کنیم.

مثال:

<!DOCTYPE html>
<html>
<body>

<button onclick=”myFunction()”>Try it</button>

<p id=”demo”></p>

<script>
function myFunction() {
document.getElementById(“demo”).innerHTML = Math.random();
}
</script>

</body>
</html>

در خوجی دکمه ای نمایش داده می شود که با کلیک بر روی آن یک عدد تصادفی بین 0 تا 1 ایجاد می کند.
برای نمایش کوچک ترین عدد بین اعداد از تابع min از کلاس Math استفاده می کنیم.

مثال:

<!DOCTYPE html>
<html>
<body>

<button onclick=”myFunction()”>Try it</button>

<p id=”demo”></p>

<script>
function myFunction() {
document.getElementById(“demo”).innerHTML =
Math.min(0, 150, 30, 20, -8, -200);
}
</script>

</body>
</html>

خروجی: -200

برای نمایش بزرگ ترین عدد بین اعداد از تابع max از کلاس Math استفاده می کنیم.

مثال:

<!DOCTYPE html>
<html>
<body>

<button onclick=”myFunction()”>Try it</button>

<p id=”demo”></p>

<script>
function myFunction() {
document.getElementById(“demo”).innerHTML =
Math.max(0, 150, 30, 20, -8, -200);
}
</script>

</body>
</html>

خروجی: 150

برای رند کردن عدد از تابع round در کلاس Math استفاده می کنیم.

مثال:

<!DOCTYPE html>
<html>
<body>

<button onclick=”myFunction()”>Try it</button>

<p id=”demo”></p>

<script>
function myFunction() {
document.getElementById(“demo”).innerHTML = Math.round(4.4);
}
</script>

</body>
</html>

خروجی: 4

نکته:این تابع قسمت اعشار عدد را حذف نمی کند بلکه عدد را رند می کند.
تفاوت تابع ceil با تابع round:

تابع round عدد را فقط رند می کند ولی ceil عدد را رو به بالا رند می کند.

مثال:

<!DOCTYPE html>
<html>
<body>

<button onclick=”myFunction()”>Try it</button>

<p id=”demo”></p>

<script>
function myFunction() {
document.getElementById(“demo”).innerHTML = Math.ceil(4.4);
}
</script>

</body>
</html>

خروجی: 5

تفاوت تابع floor با تابع ceil:

تابع ceil عدد را رو به بالا رند می کند ولی floor عدد را رو به پایین رند می کند.

مثال:

<!DOCTYPE html>
<html>
<body>

<button onclick=”myFunction()”>Try it</button>

<p id=”demo”></p>

<script>
function myFunction() {
document.getElementById(“demo”).innerHTML = Math.floor(4.7);
}
</script>

</body>
</html>

خروجی: 4

برای ایجاد یک عدد تصادفی بین 0 تا 10 باید هم از تابع floor استفاده کرد و هم از تابع random.

مثال:

<!DOCTYPE html>
<html>
<body>

<button onclick=”myFunction()”>Try it</button>

<p id=”demo”></p>

<script>
function myFunction() {
document.getElementById(“demo”).innerHTML =
Math.floor(Math.random() * 11);
}
</script>

</body>
</html>

خروجی این کد هر بار که بر روی دکمه کلیک کنید تفاوت خواهد کرد.

نکته: برای تعیین محدوده عدد تصادفی باید یک رقم بیشتر از بزرگ ترین عدد وارد شود.(در کد زیر عددی بین 0 تا 10 ایجاد می شود نه 0 تا 11)

 

نظر خودتان را ارسال کنید