您的位置:

JavaScript数字转字符

一、基本转换方法

JavaScript中通过String()、.toString()、+''、''+等方式可以将数字转换为字符串。例如:

var num = 12345;
var str1 = String(num);
var str2 = num.toString();
var str3 = num + '';
var str4 = '' + num;

console.log(str1);  // "12345"
console.log(str2);  // "12345"
console.log(str3);  // "12345"
console.log(str4);  // "12345"

以上四种转换方式都可以将数字转换为字符串类型,其中String()是将数字转换为字符串的最简便方式,num.toString()是将数字转换为字符串的经典方式,num+''、''+num则是比较暴力的转换方式,它们会将数字直接拼接在一个空字符串中。

二、数字格式化转换

在实际开发中,我们经常需要将数字格式化,比如千分位格式化、保留小数等操作。JavaScript提供了Intl.NumberFormat(), toLocaleString(),toFixed()等方法可以进行格式化转换。

1. Intl.NumberFormat()

Intl.NumberFormat()是ES6中引入的一个新对象,它用于格式化数字,支持国际化格式化,并且包括几乎所有的数字格式化需求。

var num = 1234567.89;

var formatter1 = new Intl.NumberFormat(); // 默认格式
console.log(formatter1.format(num));  // '1,234,567.89'

var formatter2 = new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' });
console.log(formatter2.format(num));  // '$1,234,567.89'

var formatter3 = new Intl.NumberFormat('de-DE', { minimumFractionDigits: 2, maximumFractionDigits: 2 });
console.log(formatter3.format(num));  // '1.234.567,89'

以上代码中,formatter1为默认格式,formatter2为货币格式,formatter3为保留两位小数。

2. toLocaleString()

toLocaleString()是JavaScript内置方法,支持格式化数字,并且同样支持国际化格式化。

var num = 1234567.89;

console.log(num.toLocaleString('en-US'));  // "1,234,567.89"
console.log(num.toLocaleString('de-DE'));  // "1.234.567,89"
console.log(num.toLocaleString('zh-Hans-CN'));  // "1,234,567.89"

以上代码中第一行为美式格式,第二行为德国格式,第三行为中国格式。

3. toFixed()

toFixed()是将数字保留指定小数位数,并且返回字符串类型的方法。

var num = 12.3456;

console.log(num.toFixed(0));   // '12'
console.log(num.toFixed(1));   // '12.3'
console.log(num.toFixed(2));   // '12.35'
console.log(num.toFixed(3));   // '12.346'
console.log(num.toFixed(4));   // '12.3456'

以上代码中,toFixed()方法的参数为要保留的小数位数,如果参数为空,或者不是数字,则默认保留0位小数。

三、进制转换

JavaScript中支持十进制、二进制、八进制、十六进制等多种数字进制格式,以及可以将不同进制的数字互相转化。

1. 进制转换方法

parseInt()和parseFloat()是两个常用的进制转换方法。

var num1 = parseInt('10100', 2);       // 将二进制转换为十进制
var num2 = parseInt('12', 8);          // 将八进制转换为十进制
var num3 = parseInt('2a', 16);         // 将十六进制转换为十进制
var num4 = parseFloat('12.34');        // 将字符串转换为小数

console.log(num1);  // 20
console.log(num2);  // 10
console.log(num3);  // 42
console.log(num4);  // 12.34

2. 进制转换实例

将十进制转换为其他进制的方法,可以使用toString()方法和数学运算。

var num = 12345;

console.log(num.toString(2));  // "11000000111001",将十进制转换为二进制
console.log(num.toString(8));  // "30071",将十进制转换为八进制
console.log(num.toString(16)); // "3039",将十进制转换为十六进制
console.log((4567).toString(36)); // "ax1",将十进制转换为三十六进制

四、数字转字符在实际开发中的应用

JavaScript数字转字符在实际开发中非常常见,比如:

  • 将价格或者金额数字格式化,并且加上货币符号
  • 将百分比数字格式化,比如将0.1234格式化为12.34%
  • 将数字转换为汉字,比如将1234.56转换为一千二百三十四点五六
  • 将数字转换为星期几、月份等

1. 实现价格或金额数字格式化

var num = 1234567.89;  
var formatter = new Intl.NumberFormat('zh-Hans-CN', { style: 'currency', currency: 'CNY' });
var money = formatter.format(num);   

console.log(money);  // '¥1,234,567.89'

以上代码将1234567.89格式化为¥1,234,567.89,其中'zh-Hans-CN'表示使用简体中文,style: 'currency'表示使用货币格式,currency: 'CNY'表示货币类型为CNY(人民币)。

2. 实现百分比数字格式化

var num = 0.1234;
var formatter = new Intl.NumberFormat('zh-Hans-CN', { style: 'percent' });
var percent = formatter.format(num);

console.log(percent);  // '12.34%'

以上代码将0.1234格式化为12.34%。

3. 实现数字转换为汉字

以下是一个简化版的数字转换为汉字的函数,可以将数字转换为中文大写形式。

function NumToChinese(num) {
    if (isNaN(num)) return '';
    var strOutput = '';
    var strUnit = '仟佰拾亿仟佰拾万仟佰拾元角分';
    num += "00"; 
    var intPos = num.indexOf('.');
    if (intPos >= 0)
        num = num.substring(0, intPos) + num.substr(intPos + 1, 2);
    strUnit = strUnit.substr(strUnit.length - num.length);
    for (var i = 0; i < num.length; i++)
        strOutput += '零壹贰叁肆伍陆柒捌玖'.substr(num.substr(i, 1), 1) + strUnit.substr(i, 1);
    return strOutput.replace(/零角零分$/g, '').replace(/零[仟佰拾]/g, '零').replace(/零{2,}/g, '零').replace(/零([亿|万])/g, '$1').replace(/零+元/, '元').replace(/亿零{0,3}万/, '亿').replace(/^元/, '零元');
}

console.log(NumToChinese(1234.56));  // "壹仟贰佰叁拾肆元伍角陆分"

4. 实现数字转换为星期几或月份

以下为简化版的星期几和月份的中英文转换函数。

var weekdays = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
function getWeekdayEnglish(weekdayIndex) {
   return weekdays[weekdayIndex];
}

var weekdaysCN = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
function getWeekdayChinese(weekdayIndex) {
   return weekdaysCN[weekdayIndex];
}

var months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
function getMonthEnglish(monthIndex) {
   return months[monthIndex];
}

var monthsCN = ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'];
function getMonthChinese(monthIndex) {
   return monthsCN[monthIndex];
}

console.log(getWeekdayEnglish(3));   // "Wednesday"
console.log(getWeekdayChinese(3));   // "星期三"
console.log(getMonthEnglish(4));     // "May"
console.log(getMonthChinese(11));    // "十二月"

五、总结

这篇文章对JavaScript数字转字符做了详细阐述,介绍了基本转换方法、数字格式化转换、进制转换以及实际开发应用等方面。在实际开发中,应该根据具体需要选择合适的转换方法,合理运用数字转字符可以为开发带来便利和效益。