如何在JavaScript中将值转换为数字?


在本文中,我们将讨论如何在JavaScript中将值转换为数字。

JavaScript引入了Number()、parseInt()、parseFloat()方法来将值转换为数字,我们也可以使用(+)一元运算符来实现。这些方法可以将数字字符串转换为数字,并将布尔值转换为1或0。让我们简要讨论一下上述方法。

我们将讨论四种将值转换为数字的可能方法,并分别举例说明。

  • Number()

  • parseInt()

  • parseFloat()

  • 一元运算符(+)

示例1

以下是一个使用Number()方法将值转换为数字的示例程序。

<!DOCTYPE html>
<html>
<head>
   <title>To convert a value to a number in JavaScript</title>
</head>
<body style="text-align : center">
   <h3></h3>
   <p id='valToNum'>To convert a value to a number in JavaScript using Number()</p>
   <script>
      let a = Number("100");
      let b = Number("100.234");
      let c = Number(true); //return 0 or 1 for boolean
      let d = Number("true"); //returns a number or NaN
      let e = Number(new Date()); //returns number of milli seconds from Jan 1 1970
      let f = Number([1.2]);
      document.getElementById('valToNum').innerHTML = `Number("100") is ${a} ${'<br/>'} Number("100.234") is ${b} ${'<br/>'} Number(true) is ${c} ${'<br/>'} Number("true") is ${d} ${'<br/>'} Number(new Date()) is ${e} ${'<br/>'} Number([1.2]) is ${f} `;
   </script>
</body>
</html>

执行上述代码后,将生成以下输出。

示例2

以下是一个使用parseInt()方法将值转换为数字的示例程序。

<!DOCTYPE html>
<html>
<head>
   <title>To convert a value to a number in JavaScript</title>
</head>
<body style="text-align : center">
   <h3></h3>
   <p id='valToNum'>To convert a value to a number in JavaScript using parseInt()</p>
   <script>
      //ParseInt() parses a string and returns a whole number, else NaN.
      let a = parseInt("100");
      let b = parseInt("100.234");
      let c = parseInt([1.2]);
      let d = parseInt(true);
      document.getElementById('valToNum').innerHTML = `parseInt("100") is ${a} ${'<br/>'} parseInt("100.234") is ${b} ${'<br/>'} parseInt([1.2]) is ${c} ${'<br/>'} parseInt(true) is ${d} `;
   </script>
</body>
</html>

执行上述代码后,将生成以下输出。

示例3

以下是一个使用parseFloat()方法将值转换为数字的示例程序。

<!DOCTYPE html>
<html>
<head>
   <title>To convert a value to a number in JavaScript</title>
</head>
<body style="text-align : center">
   <h3>To convert a value to a number in JavaScript using parseFloat()</h3>
   <p id='valToNum'></p>
   <script>
      //ParseFloat() parses a string and returns a Number.
      let a = parseFloat("100");
      let b = parseFloat("100.234");
      let c = parseFloat([1.2]);
      let d = parseFloat(true);
      document.getElementById('valToNum').innerHTML = `parseFloat("100") is ${a} ${'<br/>'} parseFloat("100.234") is ${b} ${'<br/>'} parseFloat([1.2]) is ${c} ${'<br/>'} parseFloat(true) is ${d} `;
   </script>
</body>
</html>

执行上述代码后,将生成以下输出。

示例4

以下是一个使用一元运算符(+)将值转换为数字的示例程序。

<!DOCTYPE html>
<html>
<head>
   <title>To convert a value to a number in JavaScript</title>
</head>
<body style="text-align : center">
   <h3>To convert a value to a number in JavaScript using Unary operator</h3>
   <p id='valToNum'></p>
   <script>
      // Unary operator converts a string to a Number.
      let a = +"100";
      let b = +"-100.234";
      let c = +[1.2];
      document.getElementById('valToNum').innerHTML = `+"100" is ${a} ${'<br/>'} +"-100.234" is ${b} ${'<br/>'} +[1.2] is ${c} ${'<br/>'} `;
   </script>
</body>
</html>

执行上述代码后,将生成以下输出。

更新于:2022年12月8日

3K+浏览量

启动您的职业生涯

完成课程获得认证

开始学习
广告