متدهای اعداد (Number Methods) در جاوا اسکریپت

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

متد ()toString

این متد یک عدد را به صورت یک رشته بر می گرداند و محدودیتی در این زمینه وجود ندارد، بدین معنی که متدهای مربوط به اعداد، با هر نوع عددی کار می کنند:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Number Methods</h2>

<p>The toString() method converts a number to a string.</p>

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

<script>
var x = 123;
document.getElementById("demo").innerHTML =
  x.toString() + "<br>" +
   (123).toString() + "<br>" +
   (100 + 23).toString();
</script>

</body>
</html>

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

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

123
123
123

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

متد ()toExponential

این متد عددی را گرفته و آن را به صورت رشته ای و با نوشتار نمایی بر میگرداند. این متد یک پارامتر نیز می گیرد که تعداد اعداد بعد از اعشار را مشخص می کند:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Number Methods</h2>

<p>The toExponential() method returns a string, with the number rounded and written using exponential notation.</p>

<p>An optional parameter defines the number of digits behind the decimal point.</p>

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

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

</body>
</html>

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

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

9.656e+0
9.66e+0
9.6560e+0
9.656000e+0

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

نکته: پارامتری که توسط این متد دریافت می شود، اختیاری است. اگر مقداری برای آن تعیین نکنید، جاوا اسکریپت عدد را گرد نخواهد کرد.

متد ()toFixed

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

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Number Methods</h2>

<p>The toFixed() method rounds a number to a given number of digits.</p>
<p>For working with money, toFixed(2) is perfect.</p>

<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>

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

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

متد ()toPrecision

عدد را به صورت یک رشته و با طول خاصی برمی گرداند:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Number Methods</h2>

<p>The toPrecision() method returns a string, with a number written with a specified length:</p>

<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>

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

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

متد ()valueOf

این متد یک عدد را به صورت عدد بر میگرداند:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Number Methods</h2>

<p>The valueOf() method returns a number as a number:</p>

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

<script>
var x = 123;

document.getElementById("demo").innerHTML = 
  x.valueOf() + "<br>" +
  (123).valueOf() + "<br>" +
  (100 + 23).valueOf();
</script>

</body>
</html>

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

123
123
123

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

نکته: همانطور که می دانید، اعداد در جاوا اسکریپت می توانند به صورت number یا object باشند. متد ()valueOf در کد های درونیِ خودِ جاوا اسکریپت استفاده می شود تا اعداد شی ای را به اعداد عادی تبدیل کند. بنابراین در دنیای واقعی شما نیازی به استفاده از آن ندارید.

تبدیل متغیر ها به عدد

سه راه برای تبدیل متغیر ها به عدد وجود دارد:

استفاده از ()Number

این متد متغیر ها را به اعداد تبدیل می کند:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Global Methods</h2>

<p>The Number() method converts variables to numbers:</p>

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

<script>
document.getElementById("demo").innerHTML = 
  Number(true) + "<br>" +
  Number(false) + "<br>" +
  Number("10") + "<br>" + 
  Number("  10") + "<br>" +
  Number("10  ") + "<br>" +
  Number(" 10  ") + "<br>" +
  Number("10.33") + "<br>" + 
  Number("10,33") + "<br>" +
  Number("10 33") + "<br>" +
  Number("John");
</script>

</body>
</html>

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

1
0
10
10
10
10
10.33
NaN
NaN
NaN

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

نکته: NaN زمانی برگردانده می شود که مقدار ما توانایی تبدیل شدن به عدد را نداشته باشد (به موارد آخر در کد بالا توجه کنید).

استفاده از ()parseInt

این متد رشته را تجزیه کرده و یک عدد کامل را بر میگرداند:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Global Functions</h2>

<p>The global JavaScript function parseInt() converts strings to numbers:</p>

<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>

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

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

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

استفاده از ()parseFloat

این متد رشته را تجزیه کرده و یک عدد را بر میگرداند:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Global Methods</h2>

<p>The parseFloat() method converts strings to numbers:</p>

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

<script>
document.getElementById("demo").innerHTML = 
  parseFloat("10") + "<br>" +
  parseFloat("10.33") + "<br>" +
  parseFloat("10 6") + "<br>" +  
  parseFloat("10 years") + "<br>" +
  parseFloat("years 10");    
</script>

</body>
</html>

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

10
10.33
10
10
NaN

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

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

خصوصیات اعداد

به جدول زیر توجه کنید:

خصوصیت (property)	توضیحات
MAX_VALUE	بزرگترین عدد ممکن در جاوا اسکریپت را برمی گرداند
MIN_VALUE	کوچکترین عدد ممکن در جاوا اسکریپت را برمی گرداند
POSITIVE_INFINITY	نماینده ی بی نهایت
NEGATIVE_INFINITY	نماینده ی بی نهایتِ منفی
NaN	نماینده ی مقدار "عدد نیست"

ما تک تک موارد این جدول را با ذکر مثال به شما توضیح خواهیم داد.

MAX_VALUE و MIN_VALUE در جاوا اسکریپت

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

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Number Object Properties</h2>

<p>MAX_VALUE returns the largest possible number in JavaScript.</p>

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

<script>
var x = Number.MAX_VALUE;
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

خروجی کد عدد 1.7976931348623157e+308 خواهد بود.

MIN_VALUE کوچکترین عدد ممکن در جاوا اسکریپت را برمی گرداند:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Number Object Properties</h2>

<p>MIN_VALUE returns the smallest number possible in JavaScript.</p>

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

<script>
var x = Number.MIN_VALUE;
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

خروجی این کد عدد 5e-324 خواهد بود.

مقدار POSITIVE_INFINITY در جاوا اسکریپت

مقدار Infinity یا Infinity- زمانی رخ می دهد که مقدار ما بزرگتر از بزرگترین عدد ممکن در جاوا اسکریپت باشد. به طور مثال به کد زیر نگاه کنید:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>Infinity is returned if you calculate a number outside the largest possible number:</p>

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

<script>
var myNumber = 2; 
var txt = "";
while (myNumber != Infinity) {
   myNumber = myNumber * myNumber;
   txt = txt + myNumber + "<br>";
}
document.getElementById("demo").innerHTML = txt;
</script>

</body>
</html>

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

4
16
256
65536
4294967296
18446744073709552000
3.402823669209385e+38
1.157920892373162e+77
1.3407807929942597e+154
Infinity

یکی دیگر از مواردی که باعث بروز infinity می شود تقسیم کردن هر عددی بر صفر است.

از نظر ریاضی و منطقی تقسیم به صفر مجاز نیست؛

فرض کنید یک سیب دارید و می خواهید آن را به طور مساوی بین هیچ کدام از دوستانتان تقسیم کنید! واضح است که این عملیات منطقی و انجام پذیر نیست. مثال:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>Division by zero generates Infinity;</p>

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

<script>
var x = 2/0;
var y = -2/0;
document.getElementById("demo").innerHTML = x + "<br>" + y;
</script>

</body>
</html>

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

Infinity
Infinity-

نکته: باید توجه داشته باشید که جنس و نوعِ infinity عدد است! بنابراین اگر از typeof روی آن استفاده کنید مقدار number را دریافت می کنید:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>Infinity is a number:</p>

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

<script>
var x = Infinity;
document.getElementById("demo").innerHTML = typeof x;
</script>

</body>
</html>

همانطور که انتظار می رفت، خروجی این کد number است.

اما در مورد POSITIVE_INFINITY به مثال زیر توجه کنید:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Number Object Properties</h2>

<p>POSITIVE_INFINITY</p>

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

<script>
var x = Number.POSITIVE_INFINITY;
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

بر اساس چیزی که از تعریف infinity ارائه دادیم، خروجی این کد، مقدار Infinity خواهد بود.

POSITIVE_INFINITY هنگام overflow در برنامه نویسی برگردانده می شود. مثال:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Number Object Properties</h2>

<p>POSITIVE_INFINITY is returned on overflow:</p>

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

<script>
var x = 1 / 0;
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

در اینجا خروجی Infinity خواهد بود.

مقدار NEGATIVE_INFINITY در جاوا اسکریپت

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Number Object Properties</h2>

<p>NEGATIVE_INFINITY</p>

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

<script>
var x = Number.NEGATIVE_INFINITY;
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

NEGATIVE_INFINITY نیز هنگام overflow برگردانده می شود:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Number Object Properties</h2>

<p>NEGATIVE_INFINITY</p>

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

<script>
var x = -1 / 0;
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

خروجی این کد Infinity- خواهد بود.

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

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Number Object Properties</h2>

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

<script>
document.getElementById("demo").innerHTML = Number.NaN;
</script>

</body>
</html>

در واقع NaN یکی از کلمات کلیدی رزرو شده است که اعلام می کند یک عدد، مقدار مجاز ندارد.

به طور مثال انجام محاسبات با یک رشته ی غیر عددی باعث برگردانده شدن NaN می شود:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>A number divided by a non-numeric string becomes NaN (Not a Number):</p>

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

<script>
document.getElementById("demo").innerHTML = 100 / "Apple";
</script>

</body>
</html>

مقدار خروجی این کد NaN خواهد بود.

نمی توان از خصوصیات اعداد در متغیر ها استفاده کرد

شاید تا این قسمت از کد ها با خود کلنجار رفته اید که Number چیست. باید بگویم خصوصیات اعداد به شیء اعداد در جاوا اسکریپت تعلق دارند. نام این شیء Number است. بنابراین این خصوصیات تنها از طریق Number.MAX_VALUE در دسترس خواهند بود و اگر از myNumber.MAX_VALUE استفاده کنید (به صورتی که myNumbe یک متغیر، expression یا مقدار باشد) مقدار undefined به شما برگردانده خواهد شد:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Number Object Properties</h2>

<p>Using a Number property on a variable, expression, or value, will return undefined:</p>

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

<script>
var x = 6;
document.getElementById("demo").innerHTML = x.MAX_VALUE;
</script>

</body>
</html>

خروجی این کد عبارت undefined خواهد بود.

اعداد پایه 16 (Hexadecimal)

اگر قبل از ثابت های عددی در جاوا اسکریپت از 0x استفاده کنید، جاوا اسکریپت چنین مواردی را به عنوان hexadecimal حساب می کند:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>Numeric constants, preceded by 0x, are interpreted as hexadecimal:</p>

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

<script>
var x = 0xFF;
document.getElementById("demo").innerHTML = "0xFF = " + x;
</script>

</body>
</html>

خروجی این کد 0xFF = 255 است.

در حالت پیش فرض مبنای اعداد روی 10 است. در جاوا اسکریپت هم همینطور است اما می توانید با دستور ()toString اعداد را در مبنای 2 تا 36 نمایش دهید. مثال:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Numbers</h2>

<p>The toString() method can output numbers from base 2 to 36:</p>

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

<script>
var myNumber = 32;
document.getElementById("demo").innerHTML =
"32 = " + "<br>" + 
" Decimal " + myNumber.toString(10) + "<br>" +
" Hexadecimal " + myNumber.toString(16) + "<br>" +
" Octal " + myNumber.toString(8) + "<br>" +
" Binary " + myNumber.toString(2);
</script>

</body>
</html>

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

32 =
Decimal 32
Hexadecimal 20
Octal 40
Binary 100000

توضیح: Hexadecimal بر مبنای 16 است، Decimal بر مبنای 10 است، Octal بر مبنای 8 است و Binary هم بر مبنای دو است (همان مبنای دودویی کامپیوتر ها).

امیدوارم از این قسمت استفاده ی کافی را برده باشید.

در پناه حق

دیدگاه‌های شما (1 دیدگاه)

در این قسمت، به پرسش‌های تخصصی شما درباره‌ی محتوای مقاله پاسخ داده نمی‌شود. سوالات خود را اینجا بپرسید.

mehr

02 آذر 1399

در ابتدای این صفحه نوشته شده toString اعداد را به رشته تبدیل میکند ولی در انتها نوشته شده ()toString اعداد را در مبنای 2 تا 36 نمایش دهید. میشه بیشتر توضیح بدین؟ این دوتا در نوشتن هیچ فرقی باهم ندارند ولی در عمل دو کار مختلف انجام میدن