当你在处理来自不同来源的数据时,其中一些数据可能以不正确的格式到达。而在对数据执行某些操作之前,你需要纠正这些格式。
这只是你可能想学习如何在JavaScript中把字符串转换成数字的众多原因之一。
在这篇文章中,我们将通过各种方法来学习如何将字符串转换成数字,并为每种方法提供例子。
在我们开始之前,区分字符串值的一个常见方法是,它总是用单引号或双引号括起来,而数字则不是:
"John Doe" -> String
'John Doe' -> String
"12" -> String
12 -> Number
假设我们将字符串存储在一个变量中。检查一个变量是否是字符串的一个好方法是使用typeof 操作符:
let name = "John Doe";
console.log(typeof name) // "string"
现在我们来学习如何将字符串转换为数字。
如何使用Number() 函数将一个字符串转换成一个数字
Number函数是一个强大的方法,你可以用它将字符串或其他值转换为Number类型。如果该值不能被转换,该方法也将返回NaN :
console.log(Number('212')) // 212
console.log(Number("2124")) // 2124
console.log(Number('0.0314E+2')); // 3.14
console.log(Number("Hello World")) // NaN
console.log(Number(undefined)) // NaN
这也适用于变量:
let age = "12";
let password = "John12";
console.log(Number(age)) // 12
console.log(Number(password)) // NaN
这是最容易使用的方法之一,因为它也适用于小数值,并返回数值,而不需要对它们进行操作:
let answer = "12.0";
let answer = "12.0267";
console.log(Number(answer)) // 12.0
console.log(Number(answer)) // 12.0267
如何使用parseInt() 和parseFloat() 函数将一个字符串转换为一个数字
parseInt() 和parseFloat() 函数都接收一个字符串作为参数,然后将该字符串转换为一个整数/数字。
你也可以使用parseInt() 将非整数转换成整数,而parseFloat() 是更强大的方法,因为它可以保持浮点数和一些数学逻辑:
console.log(parseInt('12')) // 12
console.log(parseInt('12.092')) // 12.092
console.log(parseInt(' 3.14 ')) // 3
console.log(parseInt('0.0314E+2')) // 0
console.log(parseInt('John Doe')) // NaN
console.log(parseFloat('12')) // 12
console.log(parseFloat('12.092')) // 12.092
console.log(parseFloat(' 3.14 ')) // 3.14
console.log(parseFloat('0.0314E+2')) // 3.14
console.log(parseFloat('John Doe')) // NaN
像往常一样,这也适用于变量:
let age = "12";
console.log(parseInt(age)) // 12
console.log(parseFloat(age)) // 12
注意:当字符串的字符不能转换为数字时,parseFloat() 函数将总是返回NaN:
console.log(parseFloat('N0.0314E+2')) // NaN
如何使用单数加运算符将字符串转换为数字 (+)
这是一个最快和最简单的方法,可以将一些东西转换成数字。我说 "某物 "是因为它转换的远不止是数字和浮点数的字符串表示--它也适用于非字符串值true,false, 和null 或空字符串。
这个方法的一个优点(也可以说是缺点)是它不对数字进行任何其他操作,比如四舍五入或将其转换为整数。
让我们看一下一些例子:
console.log(+'100'); // 100
console.log(+'100.0373'); // 100.0373
console.log(+''); // 0
console.log(+null); // 0
console.log(+true); // 1
console.log(+false); // 0
console.log(+'John Doe'); // NaN
console.log(+'0.0314E+2'); // 3.14
正如预期的那样,这也适用于变量:
let age = "74";
console.log(+age); // 74
如果你比较一下ParseInt() 和加法单选运算符,在某些情况下,你可能最终会使用加法单选运算符而不是parseInt() 方法。
例如,假设你得到的是随机值--比方说一个UUID值,在某些时候可能以数字开头,在其他时候可能以字母开头。这意味着使用parseInt() ,有时可能会返回NaN ,有时会返回数字的第一个字符:
console.log(parseInt("cb34d-234ks-2343f-00xj")); // NaN
console.log(parseInt("997da-00xj-2343f-234ks")); // 997
console.log(+"cb34d-234ks-2343f-00xj"); // NaN
console.log(+"997da-00xj-2343f-234ks"); // NaN
如何使用JavaScript数学方法将一个字符串转换成一个数字
另一种将字符串转换成数字的方法是使用一些JavScript数学方法。
你可以使用floor() 方法,它将把传来的值四舍五入到最接近的整数。ceil() 方法,与floor() 相反,将四舍五入到最近的整数。最后是round() ,该方法介于两者之间,只是将数字四舍五入到最接近的整数(根据接近程度,可以向上或向下)。
如何使用Math.floor() JavaScript方法将一个字符串转换为一个数字
就像我上面解释的那样,这将总是返回一个整数。假设我们传递一个浮动值--它将把这个值向下舍入到最接近的整数。如果我们将字母作为字符串或任何其他非整数字符传递,这将返回NaN :
console.log(Math.floor("14.5")); // 14
console.log(Math.floor("654.508")); // 654
console.log(Math.floor("0.0314E+2")); // 3
console.log(Math.floor("34d-234ks")); // NaN
console.log(Math.floor("cb34d-234ks-2343f-00xj")); // NaN
如何使用Math.ceil() JavaScript方法将一个字符串转换为一个数字
这个方法非常相似,只是将我们的浮动值四舍五入,总是返回一个整数:
console.log(Math.ceil("14.5")); // 15
console.log(Math.ceil("654.508")); // 655
console.log(Math.ceil("0.0314E+2")); // 3
console.log(Math.ceil("34d-234ks")); // NaN
如何使用Math.round() JavaScript方法将一个字符串转换成一个数字
这个方法和这两个方法一样,只是在四舍五入到最接近的整数后返回整数:
console.log(Math.round("14.5")); // 15
console.log(Math.round("654.508")); // 655
console.log(Math.round("0.0314E+2")); // 3
console.log(Math.round("34d-234ks")); // NaN
上述所有的数学方法也都可以与变量一起使用。
let age = "14.5";
console.log(Math.floor(age)); // 14
console.log(Math.ceil(age)); // 15
console.log(Math.round(age)); // 15
如何使用一些数学运算将一个字符串转换成一个数字
这并不是一个真正的方法,但它值得了解。到目前为止,我们已经讨论了实现这种转换的直接方法--但在某些情况下,你可能只想执行这些数学运算来帮助转换。
这些运算包括乘以1 ,除以1 ,还有减以0 。当我们对字符串进行这些操作时,它们将被转换为整数:
console.log("14.5" / 1); // 14.5
console.log("0.0314E+2" / 1); // 3.14
console.log("14.5" * 1); // 14.5
console.log("0.0314E+2" * 1); // 3.14
console.log("14.5" - 0); // 14.5
console.log("0.0314E+2" - 0); // 3.14
像往常一样,这也适用于变量:
let age = "14.5";
console.log(age / 1); // 14.5
console.log(age * 1); // 14.5
console.log(age - 0); // 14.5
结论
在这篇文章中,我们研究了在JavaScript中把字符串转换为整数的各种方法和途径。
最好是知道有很多方法存在,这样你就可以选择最适合你的方法,并在任何情况下应用它。