如何在JavaScript中将字符串转换为浮点数？

在本文中，我们将讨论如何在 JavaScript 中将字符串转换为浮点数。我们可以通过三种方式将字符串转换为浮点数：

  • 使用 parseFloat() 方法。
  • 使用 parseInt() 方法。
  • 使用类型转换。

使用 parseFloat() 方法

parseFloat() 是 JavaScript 中的一个函数，它接受字符串作为输入并将值转换为浮点数。

让我们考虑一个场景，其中字符串中包含数字值，如果字符串的第一个字符不是数字，则结果输出将为 NaN，这意味着输入不是数字。以下是此方法的语法：

parseFloat(value)

注意 - parseFloat() 将返回浮点数作为输出。如果输入变量的第一个字符不能转换为数字，则其输出结果为 NaN。

示例 1

在下面的示例中，我们对包含空格作为第一个字符的输入字符串执行 parseFloat() 函数。

此函数将忽略空格并将输出返回为浮点数。在第二个输入中，我们给出了空格，并且字符串的第一个字符不是数字，因此它返回 NaN。

<!DOCTYPE html>
<html>
   <title>parseFloat() function in JavaScript</title>
<head>
   <script>
      function ex1() {
         let a = parseFloat(" 400 ");
         document.write("The floating point number of the string will be: " + a + "<br>");
         let b = parseFloat(" Nikhilesh ");
         document.write("The floating point number of the string will be: " + b);
      }
      ex1()
   </script>
</head>
<body>
</body>
</html>

示例 2

在下面的示例中，我们对包含小数值的输入值执行 parseFloat() 函数。

该函数将返回与输入值中相同的小数的输出。因为输入值以数字开头。

<!DOCTYPE html>
<html>
   <title>parseFloat() function in JavaScript</title>
<head>
   <script>
      function ex2() {
         let a = parseFloat("183.1745");
         document.write('The floating point number of the string will be: ' + a);
      }
      ex2()
   </script>
</head>
<body>
</body>
</html>

示例 3

在下面的示例中，我们使用 parseFloat() 来打印字符串的浮点数。在下面的例子中，我们有两个输入值，“Nikhil007”和“007Jamesbond”。

第一个字符为数字的输入值将返回输出，而第一个字符不为数字的输入值将返回 NaN。

<!DOCTYPE html>
<html>
   <title>parseFloat() function in JavaScript</title>
<head>
   <script>
      function ex3() {
         let a = parseFloat("Nikhil007");
         document.write("when number is not first character : " + a +"<br>");
         let b = parseFloat("007Jamesbond");
         document.write("when number is first character : " + b);
      }
      ex3()
   </script>
</head>
<body>
</body>
</html>

使用 parseInt() 方法

parseInt() 函数几乎等于 parseFloat() 函数。parseInt() 仅返回整数。

此函数不处理小数，并返回小数点前的值和第一个整数。这些将在下面的示例中讨论。

示例 1

在下面的示例中，我们使用了 parseInt() 函数。我们在下面的代码中提到了几个示例。

<!DOCTYPE html>
<html>
<body>
   <h2>The parseInt() Method</h2>
   <p>parseInt() parses a string and returns the first integer:</p>
   <script>
      function parse_Int() {
         let a = parseInt(" 18 ");
         document.write(a + "<br>");
         let b = parseInt("18.00");
         document.write(b + "<br>");
         let c = parseInt("18.33");
         document.write(c + "<br>");
         let d = parseInt("18 10 7");
         document.write(d + "<br>");
         let e = parseInt(" 45 ");
         document.write(e + "<br>");
         let f = parseInt("45 inches");
         document.write(f + "<br>");
         let g = parseInt("she was 99");
         document.write(g + "<br>");
      }
      parse_Int()
   </script>
</body>
</html>

更新于：2022年9月19日

894 次浏览

启动您的职业生涯

完成课程获得认证

开始学习
广告