การจัดรูปแบบทศนิยมของตัวเลขใน javascript

โดยปกติแล้ว ตัวเลข เป็นเพียงแค่ประเภทตัวแปรหนึ่งที่ใช้กำหนดค่าตัวเลขเท่านั้น
แต่นอกเหนือจากนั้น javascript ยังมีวิธีการที่ใช้ในการจัดรูปแบบของตัวเลขได้อีกด้วย

วิธีการ การคืนค่า หรือผลลัพธ์ทีได้
.toExponential(digits) ผลลัพธ์ออกมาเป็นข้อความที่มีตัวเลขอยู่ในรูปแบบเลขยกกำลัง ซึ่งมี digits เป็นตัวกำหนดว่าจะมีจำนวนตัวเลขหลังจุดทศนิยมกี่หลัก

ตัวอย่างโค้ด

	<script language="javascript">
		var a=250000.56;
		alert(a.toExponential(2));
		// ผลลัพธ์ที่ได้จะเป็น 2.50e+5
	</script>

จากโค้ด เมื่อ a มีค่า 250000.56 และเมื่อมีการเรียกใช้ฟังก์ชัน toExponential() โดยค่า digits กำหนดเท่ากับ 2 ผลลัพธ์ที่ได้ จึงเป็น 2.50e+5 หมายความว่า มีค่าเท่ากับ (2.50 x 10)5
.50 คือค่าหลังจุดทศนิยมซึ่งเรากำหนดให้เท่ากับ 2 หลัก
e คือรูปแบบ exponential เท่ากับ x 10
+5 คือ ยกกำลัง 5

 

วิธีการ การคืนค่า หรือผลลัพธ์ทีได้
.toFixed(digits) ผลลัพธ์ออกมาเป็นข้อความที่มีตัวเลขอยู่ในรูปแบบมีจุดทศนิยมตามจำนวนที่กำหนด ซึ่งมี digits เป็นตัวกำหนดว่าจะมีจำนวนตัวเลขหลังจุดทศนิยมกี่หลัก

ตัวอย่างโค้ด

	<script language="javascript">
	var a=1.56;
	alert(a.toFixed(1));
	// ผลลัพธ์ที่ได้จะเป็น 1.6
	</script>
	

จากโค้ด เมื่อ a มีค่า 1.56 และเมื่อมีการเรียกใช้ฟังก์ชัน toFixed() โดยค่า digits กำหนดเท่ากับ 1 ผลลัพธ์ที่ได้ จึงเป็น 1.6 หมายความว่า ใ้ห้แสดงเป็นตัวเลขทศนิยม 1 ตำแหน่ง
จะสังเกตได้ว่ามีการปัดเศษ คือมากกว่า 5 ปัดขั้น น้อยกว่า 5 ปัดลง

 

วิธีการ การคืนค่า หรือผลลัพธ์ทีได้
.toLocaleString() ผลลัพธ์ออกมาเป็นข้อความที่มีตัวเลขและมีรูปแบบเป็นไปตามการกำหนดของ browser ที่กำลังใช้งานอยู่

ตัวอย่างโค้ด

<script language="javascript">
	var a=1.56;
	alert(a.toLocaleString());
	// ผลลัพธ์ที่ได้จะเป็น 1.56
</script>
	

จากโค้ด เมื่อ a มีค่า 1.56 และเมื่อมีการเรียกใช้ฟังก์ชัน toLocaleString() จะได้เป็น 1.56 ตามรูปแบบ
ของ browser กำหนด

 

วิธีการ การคืนค่า หรือผลลัพธ์ทีได้
.toPrecision(digits) ผลลัพธ์ออกมาเป็นข้อความที่มีตัวเลขอยู่ในรูปแบบทศนิยมหรือรูปแบบ exponential โดยจำนวนตัวเลขจะเป็นไปตามค่าของ digits

ตัวอย่างโค้ด

<script language="javascript">
	var a=1.56;
	alert(a.toPrecision(4));
	// ผลลัพธ์ที่ได้จะเป็น 1.560
</script>
	

จากโค้ด เมื่อ a มีค่า 1.56 และเมื่อมีการเรียกใช้ฟังก์ชัน toPrecision(); และมีการกำหนดค่า digits เท่ากับ 4
ทำให้ผลลัพธ์ออกมาเท่ากับ 1.560 คือมี 4 ตัว โดยจะเริ่มนับต้องแต่ตัวแรก จาก 1.56 จะมีแค่ 3 ตัว แต่เมื่อเรากำหนดให้มี 4 ตัว โปรแกรมก็จะเพิ่มเลข 0 เข้ามาต่อท้ายในทศนิยมให้ครบ 4 ตัวตามที่กำหนด

 

วิธีการ การคืนค่า หรือผลลัพธ์ทีได้
.toString(radix) ผลลัพธ์ออกมาเป็นข้อความที่มีตัวเลข โดยค่า radix จะมีค่าเท่ากับ 10 ซึ่งจะทำให้ได้ค่าตัวเลขเป็นเลขฐาน 10 นอกจากนั้นเรายังสามารถเปลี่ยนค่า radix เป็น
2 เพื่อกำหนดให้แปลงเป็นเลขฐานสอง
8 เพื่อกำหนดให้แปลงเป็นเลขฐานแปด
10 เพื่อกำหนดให้แปลงเป็นเลขฐานสิบ
16 เพื่อกำหนดให้แปลงเป็นเลขฐานสิบหก
ได้อีกด้วย

ตัวอย่างโค้ด

<script language="javascript">
	var a=255;
	alert(a.toString(16));
	// ผลลัพธ์ที่ได้จะเป็น ff
</script>
	

จากโค้ด เมื่อ a มีค่า 255 และเมื่อมีการเรียกใช้ฟังก์ชัน toString(radix) โดยค่า radix กำหนดเท่ากับ 16 นั้นหมายความว่าเราต้องการแปลงค่า 255 ใ้ห้เป็นเลขในฐานสิบหก ซึ่งผลลัพธ์ที่ได้ก็คือ ff ในเลขฐานสิบหกนั้นเอง

 

วิธีการ การคืนค่า หรือผลลัพธ์ทีได้
.valueOf() ผลลัพธ์ออกมาเป็นข้อความที่มีตัวเลขนั้นๆ

ตัวอย่างโค้ด

<script language="javascript">
	var a=255;
	alert(a.valueOf());
	// ผลลัพธ์ที่ได้จะเป็น 255
</script>
	

จากโค้ด เมื่อ a มีค่า 255 และเมื่อมีการเรียกใช้ฟังก์ชัน valueOf() ผลลัพธ์ที่ได้ก็จะเป็นการแสดงค่าตัวเลข
ของตัวแปร number object นั้นๆ ออกมา

 

บทความในหมวดที่่น่าสนใจ อื่นๆ JAVASCRIPT Learning

25 Sep 08 Javascript กับเทคนิค Mouseover และ Mouseout อ่าน 1560 06 Jan 09 สร้างฟังก์ชัน javascript เช็ค check email อย่างง่าย อ่าน 1544 03 Nov 08 เปิด popup แล้วให้แสดงแบบ maximize อ่าน 1530 25 Sep 08 javasdcript กับการเข้ารหัส encoding และการถอดรหัส decoding อ่าน 1395 25 Sep 08 ปิดหน้า Browser โดยไม่ต้องมีข้อความยืนยัน อ่าน 1370 24 Feb 09 สร้างรูปแบบข้อความ เบอร์โทร เลขที่บัตรประชาชน เวลา ด้วย javascript อ่าน 1336 26 Oct 08 การสร้างปุ่มยืนยันให้กับ ลิ้งค์ ด้วย function return confirm() อ่าน 1325 25 Sep 08 การสลับสีแถวในตารางด้วย javascript อ่าน 1294 22 Mar 09 สร้างฟังก์ชันโชว์รูปภาพขนาดใหญ่ด้วย javascript แบบง่าย อ่าน 1280 25 Sep 08 กรอกข้อมูลได้เฉพาะตัวเลข อ่าน 1275 28 Oct 08 การ hilight form ฟอร์มด้วย javascript อย่างง่าย อ่าน 1270 26 Oct 08 เช็ค browser ด้วย javascript ได้ทั้ง IE Firefox Opera Chrome อ่าน 1242 25 Sep 08 การทำปุ่ม Print แบบรูปภาพ อ่าน 1201 06 Jan 09 บวกวันใน javascript ด้วยฟังก์ชัน day add อย่างง่าย อ่าน 1188 25 Sep 08 เลือกหรือไม่เลือก checkbox ทั้งหมด อ่าน 1114
จำนวนผู้เยี่ยมชม 85018 คน 2010 © Copyright ninenik.com. All rights reserved.