Định dạng số trong JavaScript
Bài viết được sự cho phép của tác giả Lưu Bình An
Number.prototype.toLocaleString()
const number = 12345.6789
// sẽ lấy local mặc định của trình duyệt
console.log(number.toLocaleString());
// 12,345.679 (en-US)
console.log(number.toLocaleString('vi-VN'));
// 123.456,789
Định dạng tiền tệ
Nếu muốn định dạng tiền tệ, bạn cần sử dụng thêm tham số thứ 2 của hàm toLocaleString
{
style: 'currency',
currency: [giá trị ISO 4217] // tham số bắt buộc, ko truyền lỗi
}
Tham khảo giá trị ISO 3217
const number = 12345.6789;
console.log(
number.toLocaleString('vi-VN', {
style: 'currency',
currency: 'VND'
})
);
// 12.346 ₫
console.log(
number.toLocaleString('ja-JP', {
style: 'currency',
currency: 'JPY',
}),
);
// ¥12,346
Phần trăm
Chuyển đồi thành đơn vị phần % ngoài việc nhân với 100, ns còn thêm 2 tùy chỉnh cũng vui là minimumFractionDigits
và maximumFractionDigits
(mặc định là 0 và 2 cho kiểu tiền tệ) để lấy số lượng ký tự muốn lấy
const number = 0.1234;
console.log(
number.toLocaleString('en-US', {
style: 'percent',
minimumFractionDigits: 2,
}),
);
// 12.34%
console.log(
number.toLocaleString('en-US', {
style: 'percent',
minimumFractionDigits: 1,
}),
);
// 12.3%
Intl.NumberFormat
Nếu hông ưu Number.prototype.toLocaleString()
có thể dùng constructor Intl.NumberFormat
. Nếu như thấy sao phải lăng tăng giữa 2 thằng này? Trong trường hợp bạn cần làm việc định dạng này tới lui nhiều lần cho cùng một locale, cùng một tùy chọn cố định, thì bạn nên dùng Intl.NumberFormat
cho chuẩn tốc độ.
const numberFormat = new Intl.NumberFormat('vi-VN', {
style: 'currency',
currency: 'VND',
});
console.log(numberFormat.format(12345.6789));
// 12.346 ₫
console.log(numberFormat.format(2345.67891));
// 2.346 ₫
Natively Format JavaScript Numbers
Bài viết gốc được đăng tải tại vuilaptrinh.com
Có thể bạn quan tâm:
- 5 câu hỏi javascript và cách đánh bại chúng
- Dùng con trỏ this trong JavaScript thế nào cho đúng?
- Console Javascript quá kinh khủng
Xem thêm các việc làm JavaScript hấp dẫn tại TopDev
- S Scrum Master là gì? Tìm hiểu các vai trò chính của Scrum Master
- G Game blockchain là gì? Khám phá tiềm năng thị trường game blockchain
- N Những cải tiến đáng giá của Python 3.12
- Đ Điểm tên TOP 5 công nghệ mới đang HOT trong năm 2023
- 1 10 tính năng trên Apache Spark anh em nên biết
- G GRPC là gì? Điều gì giúp GRPC trở nên mạnh mẽ?
- W WebAssembly – Tương lai của các ứng dụng Web
- N Những ngôn ngữ lập trình phổ biến nhất hiện nay
- C Các nhóm ngành công nghệ thông tin, liệu có phù hợp với bạn?
- M Mô hình ngôn ngữ LaMDA – Công nghệ đứng sau chatbot AI Bard của Google