持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第18天，点击查看活动详情
在 JavaScript 中，有很多方法可以在数据类型之间进行转换。我们已经介绍了如何将数字转换为字符串在这个简短的教程中，我们将了解如何在 JavaScript 中将字符串转换为数字。
在许多情况下，数字可能会存储为字符串。例如，从表单元素接收的值始终是字符串。
通常，您可以将包含数字（且仅包含数字）的 JavaScript 字符串视为数字，JavaScript 会自动为您执行字符串到数字的转换。但是，有时您需要从字符串中提取数字，或者对转换的完成方式进行更多控制。
我们将介绍三种将字符串转换为数字的方法。
使用数字将字符串转换为数字
在 JavaScript 中将字符串转换为数字最直接的方法是使用内置的Number构造函数。例如：
const str = "10"
console.log(str); // "10"
console.log(typeof str); // "string"
const number = Number(str);
console.log(number); // 10
console.log(typeof number); // "number"
在控制台中记录的值str及其类型时，结果分别10为字符串和string。转换后，结果分别10为数字和number。
请注意，如果将非数字字符串传递给数字，将返回 NaN
使用 parseInt() 和 parseFloat() 将字符串转换为数字
另一种方法是使用parseInt()and parseFloat()。如您所知，parseInt()将字符串解析为整数，而parseFloat()将字符串解析为带小数点的数字。
例如：
const str = "10.9"
console.log(str); // "10.9"
console.log(typeof str); // "string"
const intNumber = parseInt(str);
console.log(intNumber); // 10
console.log(typeof intNumber); // "number"
const floatNumber = parseFloat(str);
console.log(floatNumber); // 10.9
console.log(typeof floatNumber); // "number"
与第一种方法类似，str在控制台中记录其值及其类型时，结果分别10.1为字符串和string。但是，使用 解析时str，parseInt的值intNumber变为10，其类型为number。
另一方面，使用 解析时str，parseFloat的值floatNumber变为10.1数字，其类型为number。
parseInt 的第二个参数
parseInt()接受第二个参数，该参数指定要从字符串中解析的数字的基数。此参数实际上是可选的，但强烈建议您始终提供它。
如果没有第二个参数，则parseInt执行自动基数检测。也就是说，它通过字符串中的格式检测数字的基数。0x以或开头的数字0X被视为十六进制（以 16 为基数），所有其他数字被视为十进制。
因此，例如，如果您要调用parseInt("08")，则输入值将被视为八进制数；但 8 不是八进制数字（因为八进制编号是 0-7），所以该函数将返回值 0，而不是 8。
为避免任何混淆，请始终在使用时指定基数parseInt()。
使用一元加号将字符串转换为数字
第三种将字符串转换为数字的方法是使用一元加号 ( +)。如果在操作数之前使用一元加号，它会尝试将其转换为数字。因此，如果操作数是包含数字的字符串，一元加号会将其转换为数字。
例如：
const str = "10";
console.log(typeof str); // "string"
console.log(+str); // 10
console.log(typeof +str); // "number"
当您str按预期记录 的类型时，它是string. 但是，当您记录其值+str及其类型时，10会number分别记录在控制台中。
如何处理字符串中的非数字字符
重要的是要考虑字符串可能包含数字以外的字符以及每种方法如何处理这种情况的情况。
使用 时Number()，如果字符串中包含除数字、加号（+）和减号（-）开头或小数点以外的字符，则返回值为特殊值 NaN（Not-a-Number）。NaN 是一个表示 Not-a-Number 的全局属性。当这些运算的操作数或参数不是数字或不能用于该特定数学运算时，它由一些数值运算返回
另一方面，如果数字在字符串的开头parseInt()，parseFloat()则解析字符串。它删除其余字符并获取在字符串开头遇到的数字。但是，如果字符串以数字、开头的加号（+）和减号（-）或小数点以外的字符开头，则返回值是特殊值 NaN（非数字）。
结论
这个简短的教程介绍了在 JavaScript 中将字符串转换为数字的三种方法。Number()可以将字符串转换为数字，无论是浮点数还是整数。但是，如果字符串包含其他字符，则返回 NaN。如果您想确保字符串的严格转换，这将很有帮助。
另一方面，parseInt()在parseFloat()处理数字中的其他字符方面是更灵活的方法。但是，在某些情况下，这两个功能不能互换使用。例如，如果字符串中的数字是浮点数并且您使用parseInt()，与字符串相比，您将得到一个不正确的值。
虽然一元很容易使用，但它会降低代码的可读性。无论您选择哪种方法，重要的是要注意返回的结果可能是 NaN 的情况。
