บทความนี้จะอธิบายวิธีการที่สามารถนำไปใช้เพื่อจัดรูปแบบตัวเลขใน JavaScript
จะจัดรูปแบบตัวเลขใน JavaScript ได้อย่างไร
วิธีการต่อไปนี้สามารถนำไปใช้เพื่อจัดรูปแบบตัวเลขใน JavaScript:
- “ เพื่อแก้ไข () ' วิธี.
- “ Intl.NumberFormat() ตัวสร้าง
- “ toLocaleString() ' วิธี.
- “ นิพจน์ทั่วไป ”
แนวทางที่กล่าวถึงตอนนี้จะแสดงให้เห็นทีละภาพ!
ตัวอย่างที่ 1: จัดรูปแบบตัวเลขใน JavaScript โดยใช้วิธี toFixed()
สามารถใช้วิธีนี้เพื่อจัดรูปแบบตัวเลขที่ให้มาในลักษณะที่ไม่มีจุดทศนิยมเหลืออยู่ในนั้นหรือมีตัวเลขที่แน่นอนเหลืออยู่หลังจุดทศนิยม
ขั้นแรก ระบุตัวเลขที่จะจัดรูปแบบ:
ให้รูปแบบหมายเลข = 12.345678 ;
ถัดไป ใช้ “ เพื่อแก้ไข () ” วิธีการจัดรูปแบบตัวเลขที่กำหนดเพื่อให้ไม่มีตัวเลขเหลืออยู่หลังจุดทศนิยม:
คอนโซล บันทึก ( 'ตัวเลขที่จัดรูปแบบคือ:' , หมายเลขรูปแบบ แก้ไข ( ) ) ;ในขั้นตอนนี้ก็ใช้วิธีเดียวกันโดยผ่าน “ สอง ” ในพารามิเตอร์ ซึ่งจะส่งผลให้การจัดรูปแบบตัวเลขเป็นทศนิยมสองตำแหน่ง:
คอนโซล บันทึก ( 'ตัวเลขที่จัดรูปแบบคือ:' , หมายเลขรูปแบบ แก้ไข ( สอง ) ) ;
เอาต์พุต
ตัวอย่างที่ 2: จัดรูปแบบตัวเลขใน JavaScript โดยใช้ตัวสร้าง Intl.NumberFormat()
“ Intl.NumberFormat() ” ตัวสร้างสร้างวัตถุใหม่ที่เปิดใช้งานการจัดรูปแบบของตัวเลขที่มีความสำคัญต่อภาษา วิธีการนี้สามารถใช้เพื่อจัดรูปแบบตัวเลขที่กำหนดตามสกุลเงินที่ระบุ
ประการแรก ระบุตัวเลขที่จะจัดรูปแบบ:
คอสต์ หมายเลขรูปแบบ = 12345.67 ;ตอนนี้ ใช้ “ Intl.NumberFormat() ” วิธีการจัดรูปแบบตัวเลขที่ระบุในส่วนที่เกี่ยวกับ “ เรา ” สกุลเงิน และแสดงตาม:
ให้ numUpd = ใหม่ นานาชาติ รูปแบบตัวเลข ( 'ในสหรัฐอเมริกา' , { สไตล์ : 'สกุลเงิน' , สกุลเงิน : 'ดอลล่าร์' } ) . รูปแบบ ( หมายเลขรูปแบบ ) ;คอนโซล บันทึก ( 'สกุลเงินที่จัดรูปแบบคือ:' , numUpd ) ;
เอาต์พุต
“ $ ” ที่มีตัวเลขแสดงว่าตัวเลขที่ให้มานั้นอยู่ในรูปแบบ “ เรา ' สกุลเงิน.
ตัวอย่างที่ 3: จัดรูปแบบตัวเลขใน JavaScript โดยใช้วิธี toLocaleString()
“ toLocaleString() ” วิธีการให้วัตถุวันที่ในรูปแบบของสตริง สามารถใช้วิธีนี้เพื่อจัดรูปแบบตัวเลขเป็นรูปแบบภาษาที่ระบุ
ไวยากรณ์
วันที่ . toLocaleString ( ท้องถิ่น , ตัวเลือก )- “ ท้องถิ่น ” อ้างอิงถึงรูปแบบภาษาเฉพาะ
- “ ตัวเลือก ” ชี้ไปที่วัตถุที่สามารถกำหนดคุณสมบัติได้
ในตัวอย่างด้านล่าง ให้จัดสรรหมายเลขต่อไปนี้ให้กับตัวแปรชื่อ “ หมายเลขรูปแบบ ”:
ให้รูปแบบหมายเลข = 7323452568.283 ;ตอนนี้ ใช้ “ toLocaleString() ” วิธีการระบุรูปแบบภาษาเป็น “ ในสหรัฐอเมริกา ” ในพารามิเตอร์ และแสดงตัวเลขที่จัดรูปแบบผลลัพธ์:
เคยเป็น เรา = หมายเลขรูปแบบ toLocaleString ( 'ในสหรัฐอเมริกา' ) ;คอนโซล บันทึก ( 'ตัวเลขที่จัดรูปแบบคือ:' , เรา ) ;
เอาต์พุต
ตัวอย่างที่ 4: จัดรูปแบบตัวเลขใน JavaScript โดยใช้ Regular Expression
วิธีการนี้สามารถใช้ร่วมกับ “ แทนที่() ” วิธีการวางเครื่องหมายจุลภาคระหว่างตัวเลขที่ให้ไว้ในช่วงเวลาเดียวกันเป็นผล
ขั้นแรก ให้เริ่มต้นหมายเลขต่อไปนี้:
เคยเป็น หมายเลขรูปแบบ = 445567788 ;ตอนนี้ให้ใช้วิธีแทนที่ () พร้อมกับนิพจน์ทั่วไป นิพจน์ทั่วไปที่นี่จะจัดสรร “ เครื่องหมายจุลภาค ” เป็นค่าเริ่มต้นโดยการค้นหาทั่วโลกและส่งกลับค่าที่คั่นด้วยเครื่องหมายจุลภาค ดังนั้นการจัดรูปแบบตัวเลขที่ระบุ:
คอนโซล บันทึก ( 'ตัวเลขที่จัดรูปแบบคือ:' , สตริง ( หมายเลขรูปแบบ ) . แทนที่ ( /(.)(?=(\d{3})+$)/ก , '1 ดอลลาร์' ) )เอาต์พุต
เราได้สรุปวิธีการที่สะดวกในการจัดรูปแบบตัวเลขใน JavaScript
บทสรุป
“ เพื่อแก้ไข () ” วิธีการ “ Intl.NumberFormat() ” ตัวสร้าง, the “ toLocaleString() ” วิธีการ หรือ “ นิพจน์ทั่วไป ” สามารถใช้เพื่อจัดรูปแบบตัวเลขใน JavaScript วิธีแรกส่งผลให้จัดรูปแบบตัวเลขในลักษณะที่ไม่มีตัวเลขหรือจำนวนหลักคงที่เหลืออยู่หลังจุดทศนิยม สามารถใช้วิธีการสร้าง Intl.NumberFormat() เพื่อจัดรูปแบบตัวเลขตามสกุลเงิน และสามารถใช้เมธอด toLocaleString() เพื่อจัดรูปแบบตัวเลขที่ระบุเป็นรูปแบบเฉพาะของภาษา สามารถใช้เทคนิคนิพจน์ทั่วไปเพื่อจัดรูปแบบตัวเลขที่ให้ในลักษณะที่จะส่งคืนค่าที่คั่นด้วยเครื่องหมายจุลภาค บล็อกนี้แสดงวิธีการจัดรูปแบบตัวเลขที่ระบุใน JavaScript