如何在JavaScript中将数字转换为数组

在JavaScript中，有许多内置方法可以将数字转换为数组。最简单的方法是使用split()方法。我们还可以使用map()、reduce()或form()方法来执行这个任务。本文将讨论一些最常用的将数字转换为数组的方法，并提供了每种技术何时以及如何应用的示例。

那么问题就是，为什么需要将数字转换为数组呢？原因可能是将电话号码拆分为单个数字，或者将日期分解为组成部分（解析日期），或者在对单个数字进行数学运算时很有用。

方法1：使用split()方法

现在，我们来看一下split()方法。它是一个将字符串分解为较小子字符串并将其转换为数字的有用工具。然后，通过将数字转换为字符串并将其拆分为单个数字，它甚至可以将数字转换为数组。让我们通过实现示例中的split()函数来看一下。

示例

在这个示例中，我们使用toString()函数将整数转换为字符串。然后使用split()函数将字符串分解为由单个字符组成的数组。最后的输出将是一个字符串数组，每个字符串都代表原始数字的一个数字。

<html>
<body>
   <p id="print"></p>
   <script>
      let number = 12345;
      let numberArray = number.toString().split("");
      document.getElementById("print").innerHTML = numberArray;
   </script>
</body>
</html>

方法2：使用map()方法

通过使用map()方法，可以创建一个新的数组，其中包含对调用数组中的每个元素执行给定函数的输出。通过利用map()方法创建一个数字数组，也可以将一个数字转换成数组。下面是使用map()方法将整数转换成数组的示例：

示例

在这个示例中，我们首先使用toString()函数将整数转换成字符串。然后使用Array.from()函数将字符串转换成数组。最后，我们通过使用map()方法将字符串数组转换成整数数组。

<html>
<body>
   <p id="print"></p>
   <script>
      let number = 12345;
      let numberArray = Array.from(number.toString(), Number).map(Number);
      document.getElementById("print").innerHTML =numberArray;
   </script>
</body>
</html>

方法3：使用for循环

这种方法是最简单的，它使用for循环遍历数字并将其转换为数字数组。

示例

在这个示例中，我们首先使用toString()方法将数字转换为字符串。然后我们使用for循环遍历数字，并使用parseInt方法将每个数字转换并推送到数组中。

<html>
<body>
   <p id="print"></p>
   <script>
      let number = 12345;
      let numberArray = [];
      for (let i = 0; i < number.toString().length; i++) {
         numberArray.push(parseInt(number.toString()[i]));
      }
      document.getElementById("print").innerHTML = numberArray;
   </script>
</body>
</html>

方法4：使用reduce()方法

reduce()方法是一个数组方法，可用于将数组减少为单个值。在本示例中，我们将使用reduce()方法将数字转换为数字数组。

示例

在此示例中，我们首先使用toString()方法将数字转换为字符串。然后，我们使用split()方法将字符串拆分为单个字符的数组。最后，我们使用reduce()方法对字符数组进行迭代，将每个字符解析为整数并将其添加到最后的数组中，该数组是此示例中的累加器。

<html>
<body>
   <p id="print"></p>
   <script>
      let number = 12345;
      let numberArray = number.toString().split('').reduce((acc, curr) => {
         return [...acc, parseInt(curr)];
      }, []);
      document.getElementById("print").innerHTML=numberArray ;
   </script>
</body>
</html>

方法5：使用Array.from()方法

现在，我们将学习另一种将数字转换或更改为数组的方法。因此，在这里我们将使用Array.from方法()。Array.from的作用是从可迭代的对象或类似数组的对象生成一个新的数组。在这种情况下，我们可以使用Array.from()方法将数字的字符串表示转换为由单个数字组成的数组。

示例

现在，让我们看一下上述方法的代码。

<html>
<body>
   <p>Original number: 12345</p>
   <p id="result"></p> 
   <script>
      const num = 12345;
      const arr = Array.from(num.toString(), Number);
      document.getElementById("result").innerHTML = arr.join(", ");
   </script>
</body>
</html>