详解JS转换数值函数Number()、parseInt()、parseFloat()

前言

在JavaScript中，数值转换是很常见的操作。例如，用户输入的内容可能是字符串类型，而你需要将其转换成数值类型，或者你需要将数值类型转换为字符串类型，以便于存储或展示。为此，JavaScript提供了一些原生的函数用于进行数值类型之间的转换。其中，最常用的三个函数分别是Number()、parseInt()、parseFloat()。然而，很多人对这三个函数的使用会感到困惑，本篇文章将详细讲解这三个函数的用法和区别。

Number()

Number()函数可以将任何类型的数据转换为数值类型。具体使用方法如下：

var num1 = Number('123');
var num2 = Number(true);
var num3 = Number(false);
var num4 = Number(null);
var num5 = Number(undefined);

console.log(num1); // 123
console.log(num2); // 1
console.log(num3); // 0
console.log(num4); // 0
console.log(num5); // NaN

在上面的示例中，我们使用Number()函数将字符串、布尔值、null和undefined转换成了数值类型。需要注意的是，如果转换的数据不是数值类型，则Number()函数会返回一个NaN（Not a Number）的值。

parseInt()

parseInt()函数可以将字符串类型的整数转换为数值类型。具体使用方法如下：

var num1 = parseInt('123');
var num2 = parseInt('123.45');
var num3 = parseInt('hello world');

console.log(num1); // 123
console.log(num2); // 123
console.log(num3); // NaN

需要注意的是，parseInt()函数只能将字符串类型的整数转换成数值类型。如果字符串中包含小数点等其他字符，则会被截断。例如，parseInt('123.45')的结果是123而不是123.45。另外，如果字符串中包含无法转换成数值类型的字符，则返回一个NaN（Not a Number）的值。

parseFloat()

parseFloat()函数可以将字符串类型的数值类型转换为数值类型。具体使用方法如下：

var num1 = parseFloat('123');
var num2 = parseFloat('123.45');
var num3 = parseFloat('hello world');

console.log(num1); // 123
console.log(num2); // 123.45
console.log(num3); // NaN

需要注意的是，parseFloat()函数可以将字符串中的小数点转换为数值类型，而parseInt()函数则只能将字符串中的整数部分转换为数值类型。同时，如果字符串中包含无法转换成数值类型的字符，则返回一个NaN（Not a Number）的值。

示例说明

示例一：

var num1 = Number("123");
var num2 = parseInt("123");
var num3 = parseFloat("123.45");

console.log(num1); // 123
console.log(num2); // 123
console.log(num3); // 123.45

在这个示例中，我们将字符串‘123’分别使用Number()、parseInt()和parseFloat()函数进行转换，并打印出了结果。从输出结果可以看出，在这种普通整数字符串情况下，三个函数都能够很好地转换成数值类型，并且得到的数值结果是相同的。因此，这时候使用哪个函数都是可以的。

示例二：

var num1 = Number("hello world");
var num2 = parseInt("hello world");
var num3 = parseFloat("hello world");

console.log(num1); // NaN
console.log(num2); // NaN
console.log(num3); // NaN

在这个示例中，我们将字符串‘hello world’分别使用Number()、parseInt()和parseFloat()函数进行转换，并打印出了结果。从输出结果可以看出，在这种情况下，无论使用哪个函数，都会得到一个NaN（Not a Number）的值。因此，我们必须保证将需要进行转换的数据是符合数值类型要求的，否则则会得到错误的结果。

总结

虽然Number()、parseInt()和parseFloat()函数都可以将字符串类型转换为数值类型，但是它们之间还是存在很大的区别的，需要根据不同的需求来使用。Number()函数是将任何类型的数据转换为数值类型，可以处理整数、小数、布尔值等多种数据类型；parseInt()函数只能将纯整数字符串转换成数值类型，小数会被截断；parseFloat()函数则可以将字符串中的小数点转换为数值类型。在使用时，我们需要根据具体情况来选择适合于自己的函数来进行转换。