การแยกตัวเลขใน JavaScript
ฟังก์ชัน Number ทำงานได้เฉพาะ
กับสตริงที่ประกอบด้วยตัวเลขเท่านั้น
อย่างไรก็ตาม เมื่อเขียนโปรแกรมด้วย JavaScript
มักพบสถานการณ์ที่คุณต้อง
จัดการกับสตริงที่ขึ้นต้นด้วย
ตัวเลข ตามด้วยตัวอักษร
ตัวอย่างของสตริงดังกล่าวอาจเป็นค่า
ในหน่วยพิกเซล: '12px' สมมติว่าเราต้องการ
นำตัวเลขที่อยู่ด้านหน้าออกมา โดยทิ้ง
ส่วนที่เป็นสตริงไว้ สำหรับการดำเนินการดังกล่าวมี
ฟังก์ชัน parseInt มาดูการทำงานของมัน
ผ่านตัวอย่างกัน:
let num = parseInt('12px');
alert(num); // จะแสดง 12
อย่างไรก็ตาม พิกเซลบางครั้งอาจเป็นทศนิยม:
'12.5px' ในกรณีนี้ ฟังก์ชัน parseInt
จะทำงานไม่ได้และแสดงเฉพาะส่วนที่เป็นจำนวนเต็ม:
let num = parseInt('12.5px');
alert(num); // จะยังคงแสดง 12
โดยทั่วไปแล้ว, การทำงานแบบนี้อาจเป็น
สิ่งที่คุณต้องการ แต่ถ้าไม่ใช่ - ให้ใช้
ฟังก์ชัน parseFloat ซึ่งจะดึง
ตัวเลขพร้อมกับส่วนที่เป็นทศนิยมออกมา:
let num = parseFloat('12.5px');
alert(num); // จะแสดง 12.5
แน่นอนว่า การไม่มีส่วนที่เป็นทศนิยมไม่ได้ทำให้
ฟังก์ชัน parseFloat ทำงานได้ไม่ถูกต้อง:
let num = parseFloat('12px');
alert(num); // จะแสดง 12
กำหนดตัวแปรที่มีค่า '5px' และ
ตัวแปรที่มีค่า '6px' จงหา
ผลรวมของพิกเซลจากค่าของตัวแปรเหล่านี้
และแสดงผลบนหน้าจอ
กำหนดตัวแปรที่มีค่า '5.5px'
และตัวแปรที่มีค่า '6.25px'
จงหาผลรวมของพิกเซลจากค่าของตัวแปรเหล่านี้
และแสดงผลบนหน้าจอ
ปรับเปลี่ยนโจทย์ก่อนหน้า เพื่อให้
ผลลัพธ์ที่แสดงออกมามีตัวอักษร
'px' ต่อท้าย นั่นคือ ถ้าผลรวมของเราเท่ากับ
11.75 ให้แสดงผลบนหน้าจอเป็น
'11.75px'