巧用字符串处理函数，轻松实现金额格式化！

在前端项目中，金额格式化展示是常见的需求，例如：商品价格、订单金额、工资收入等。金额格式化可以使数字更易读、更直观，方便用户理解和比较。

1. toLocaleString() 方法

toLocaleString() 方法是 JavaScript 中内置的数字格式化函数，它可以将数字格式化为字符串，并根据当前语言环境自动添加千分位分隔符和小数点。

const amount = 1234567.89;
const formattedAmount = amount.toLocaleString();
console.log(formattedAmount); // "1,234,567.89"

toLocaleString() 方法接受一个可选的参数，该参数指定要使用的语言环境。例如，要将数字格式化为中文格式，可以使用以下代码：

const amount = 1234567.89;
const formattedAmount = amount.toLocaleString('zh-CN');
console.log(formattedAmount); // "1,234,567.89"

2. 正则表达式

正则表达式是一种强大的字符串处理工具，也可以用于金额格式化。使用正则表达式，我们可以将数字字符串拆分为整数部分和小数部分，然后分别添加千分位分隔符和小数点。

const amount = '1234567.89';
const regex = /(\d+)(\d{3})/;
while (regex.test(amount)) {
  amount = amount.replace(regex, '$1,$2');
}
console.log(amount); // "1,234,567.89"

3. slice() 循环截取

slice() 方法可以从字符串中截取指定范围的字符。我们可以使用 slice() 方法将数字字符串拆分为整数部分和小数部分，然后分别添加千分位分隔符和小数点。

const amount = '1234567.89';
let integerPart = amount.slice(0, amount.indexOf('.'));
let decimalPart = amount.slice(amount.indexOf('.') + 1);
while (integerPart.length > 3) {
  integerPart = integerPart.slice(0, integerPart.length - 3) + ',' + integerPart.slice(integerPart.length - 3);
}
const formattedAmount = integerPart + '.' + decimalPart;
console.log(formattedAmount); // "1,234,567.89"

4. 小数点精度控制

在金额格式化时，有时需要控制小数点精度，例如，只保留两位小数。我们可以使用 toFixed() 方法来控制小数点精度。

const amount = 1234567.8945;
const formattedAmount = amount.toFixed(2);
console.log(formattedAmount); // "1,234,567.89"

5. 总结

以上介绍了多种实用的金额格式化处理方式。在实际项目中，我们可以根据具体需求选择合适的方式进行金额格式化。

在使用金额格式化时，需要注意以下几点：

• 千分位分隔符和货币符号的格式可能因国家/地区而异，需要根据实际情况进行调整。
• 小数点精度需要根据业务需求进行控制，避免不必要的小数位数。
• 在使用正则表达式时，需要确保表达式能够正确匹配数字字符串，避免出现格式化错误。

希望这些内容对您有所帮助，如果您有任何问题或建议，欢迎随时留言交流。