Định dạng tiền tệ JavaScript

Khi làm việc với tiền tệ, số thập phân chỉ cần chính xác đến giá trị xu nhỏ nhất trong khi tránh các lỗi dấu phẩy động phổ biến khi thực hiện các phép tính cơ bản. tiền tệ. js giải quyết vấn đề này bằng cách làm việc ngầm với các số nguyên, vì vậy bạn không cần phải lo lắng về độ chính xác thập phân

Để biết thêm chi tiết về lý do Javascript gặp sự cố với số dấu phẩy động, có một bài nói chuyện tuyệt vời của Bartek Szopka về mọi thứ bạn không bao giờ muốn biết về số Javascript giải thích tại sao Javascript và các triển khai IEEE 754 khác có vấn đề về dấu phẩy động

tiền tệ. js sẽ hoạt động với nhiều loại đầu vào, bao gồm strings, numbers,

yarn add currency.js

yarn add currency.js

Giá trị tiền tệ được xử lý minh bạch phía sau hậu trường, vì vậy bạn không phải lo lắng về những vấn đề về dấu phẩy động phiền phức đó

Vì tiền tệ. js xử lý các giá trị bên trong dưới dạng số nguyên, có giới hạn về độ chính xác có thể được lưu trữ trước khi gặp lỗi chính xác. Điều này sẽ ổn đối với hầu hết các giá trị hợp lý của tiền tệ. Miễn là tiền tệ của bạn nhỏ hơn 253 [bằng cent] hoặc

yarn add currency.js

tiền tệ. js cũng hoạt động với nhiều loại chuỗi. Điều này giúp bạn dễ dàng làm việc với giao diện người dùng của mình mà không cần phải thực hiện chuyển đổi chuỗi thành số hoặc ngược lại

Theo mặc định, tiền tệ phân giải thành giá trị

yarn add currency.js

Nếu bạn cần truy cập vào các số nguyên, giá trị được lưu trữ dưới dạng cả

yarn add currency.js

yarn add currency.js

yarn add currency.js

yarn add currency.js

Hướng dẫn này dạy chúng ta định dạng số dưới dạng chuỗi tiền tệ đô la trong JavaScript. Bây giờ, câu hỏi đặt ra là tại sao chúng ta cần định dạng các số dưới dạng chuỗi tiền tệ đô la? . Người dùng có thể nghĩ về kịch bản khi họ đang phát triển một trang web hoặc ứng dụng Thương mại điện tử và phải hiển thị giá sản phẩm cho khách hàng. Điều gì sẽ xảy ra nếu họ đưa ra giá sản phẩm như 2500 và 2500 đô la? . Ngoài ra, cách tiếp cận thứ hai dễ hiểu hơn

Dưới đây, chúng tôi đã đưa ra các cách tiếp cận khác nhau để giải quyết vấn đề trên và hiển thị các con số dưới dạng chuỗi tiền tệ USD

• Sử dụng nối chuỗi
• Sử dụng quốc tế. Phương thức NumberFormat[]
• Sử dụng Phương thức toLocaleString[]

Sử dụng nối chuỗi

Theo cách tiếp cận này, chúng tôi sẽ chỉ sử dụng phép nối chuỗi bằng dấu '+' trong JavaScript. Cách tiếp cận này là cách dễ nhất để biểu thị số dưới dạng chuỗi tiền đô la

cú pháp

let price = 1642;
var currencyUSD = ‘$’ + price;

ví dụ 1

Ví dụ dưới đây minh họa cách người dùng có thể thêm ký hiệu '$' vào số bằng cách sử dụng phép nối chuỗi trong JavaScript

   
Format Numbers as a dollar currency string
   
 Formatting 1642 as US dollars [US$]:
   
 
   

Trong đầu ra ở trên, Người dùng có thể thấy rằng giá của chúng tôi được định dạng như thế nào với chuỗi đơn vị tiền tệ đô la

Sử dụng quốc tế. Phương thức NumberFormat[]

Một trong những cách tốt nhất trong JavaScript để định dạng số dưới dạng chuỗi tiền tệ là sử dụng Intl. Phương thức NumberFormat[]. Bạn có thể chuyển ngôn ngữ cho phương thức dưới dạng tham số và đặt ký hiệu đô la trước số và số định dạng

Một số bạn đã nghe từ Locale lần đầu tiên. Nó không phải là bất kỳ phương thức nào bên trong JavaScript, nhưng nó cung cấp tập hợp các tham số theo vùng địa phương. Nói một cách đơn giản, nó chỉ định định dạng số khu vực, định dạng ngày và giờ, định dạng tiền tệ, định dạng ngày trong tuần, v.v.

cú pháp

let formatting_options = {
   style: 'currency',
   currency: 'USD',
   minimumFractionDigits: 3,
}
let dollarString = new Intl.NumberFormat[ locale_string, formatting_options ];

Thông số

• locale_string  − Nó phải được chuyển theo khu vực mà bạn muốn nhận thông số cục bộ. Ví dụ: để lấy thông số địa phương của Hoa Kỳ, bạn sẽ nhập 'en-US' và đối với Ấn Độ, bạn sẽ nhập 'en-IN'. ’

• format_options − Là đối tượng chứa rất nhiều thuộc tính để định dạng chuỗi số. Chủ yếu, ba thuộc tính dưới đây của quyền chọn có giá trị hơn

• style - Đây là kiểu cơ bản của chuỗi được định dạng số. Nó nhận ba giá trị khác nhau, chẳng hạn như “tiền tệ”, “thập phân” và “phần trăm. ” Trong trường hợp của chúng tôi, chúng tôi sẽ sử dụng “tiền tệ

• tiền tệ - Tham số này chỉ định ký hiệu của tiền tệ, chẳng hạn như “USD” cho đô la Mỹ

• minimumFractionDigits − Bằng cách sử dụng tham số này, chúng ta có thể làm tròn các chữ số của số sau dấu thập phân

ví dụ 2

Ví dụ dưới đây minh họa việc sử dụng Intl. Phương thức định dạng số []

   
 The Intl.NumberFormat[] method
   
 Formatting 5323.35445 as US dollars [US$]:

  


   
   
 We set minimumFractionDigits to 3.
   

Ở kết quả trên, người dùng có thể thấy số đó được làm tròn đến 3 điểm và được biểu thị dưới dạng chuỗi có ký hiệu đô la

Sử dụng Phương thức toLocaleString[]

toLocaleString[] cũng là phương thức tích hợp sẵn trong JavaScript như Intl. phương thức numberFormat[]. Nó nhận cùng tham số với Intl. phương thức numberFormat lấy và chuyển đổi các chuỗi thành các chuỗi cụ thể theo vùng

cú pháp

let formatting_options = {
   style: ‘currency’,
   currency: ‘USD’,
   minimumFractionDigits: 3,
}
let dollarString = toLocaleString[ locale_string, formatting_options ];

Thông số

Nó có các tham số giống như Intl. phương thức numberFormat[] nhận. Người dùng có thể tham khảo phương pháp trên cho điều đó

ví dụ 3

Ví dụ dưới đây minh họa định dạng số có ký hiệu đô la bằng phương thức toLocaleString[]

   
 The toLocaleString[] method
   
 Formatting 2434454.6554 as US dollars [US$]:
   
   

Phương pháp trên cho cùng một đầu ra như Intl. phương thức numberFormat[]. Trong kết quả trên, người dùng có thể thấy số đó được định dạng bằng ký hiệu đô la và được làm tròn thành 3 chữ số sau dấu thập phân

Phần kết luận

Hướng dẫn này dạy chúng ta ba cách tiếp cận khác nhau để định dạng số bằng chuỗi đô la. Cách tiếp cận tiêu chuẩn và tốt nhất để giải quyết vấn đề của chúng tôi là cách tiếp cận thứ hai. Sử dụng quốc tế. numberFormat[], bạn có thể chuyển đổi tất cả các chuỗi, số và tham số thành các chuỗi phân biệt theo vùng

Làm cách nào để định dạng giá trị tiền tệ trong JavaScript?

Làm cách nào để thay đổi định dạng số trong JavaScript?

Làm cách nào để áp dụng định dạng số trong JavaScript?

Làm cách nào để thay đổi tiền tệ trong JavaScript?