JavaScript数组重新排序

给定的任务是用 JavaScript 重新排序一个数组。

我们可以使用以下方法重新排序数组中的元素。实现上述任务的一种方法是使用sort()方法。

sort()是 JavaScript 中一个内置方法，它对字母元素进行排序。默认情况下，它按升序排序。

示例

下面的示例显示数组按升序重新排序：

<!DOCTYPE html>
<html>
<body>
   <p id="para1"></p>
   <p id="para2"></p>
   <script>
      const States = ["Telangana", "Uttar Pradesh", "Karnataka", "Kerala", "TamilNadu"];
      document.getElementById("para1").innerHTML = States;
      States.sort();
      document.getElementById("para2").innerHTML = States;
   </script>
</body>
</html>

我们可以看到，sort() 方法将数组的元素按升序排序：

reverse() 方法

reverse()方法将反转数组元素。第一个元素将放在最后，最后一个元素将放在第一位。此方法将更改原始数组。

const array = ['welcome', 'Tutorials', 'point'];
const rev = array.reverse();
console.log(rev);
// output: ["three", "two", "one"]
console.log(array);
// output: ["three", "two", "one"]

示例 1

在下面的示例中，我们通过反转元素来改变数组的顺序：

<!DOCTYPE html>
<html>
<body>
   <p id="para1"></p>
   <p id="para2"></p>
   <script>
      const cities = ["vizag", "Hyderabad", "bangalore", "Guragaon"];
      document.getElementById("para1").innerHTML = cities;
      cities.reverse();
      document.getElementById("para2").innerHTML = cities;
   </script>
</body>
</html>

reverse()方法在下面的输出中以相反的顺序返回数组元素：

示例 2

在下面的示例中，我们声明了一个包含整数值的数组。我们进行了交换以重新排序数组元素。借助temp变量，我们移动了数组元素。

<!DOCTYPE html>
<html>
<body>
   <p id="para1"></p>
   <p id="para2"></p>
   <script>
      let array = [23, 53, 12, 87, 9];
      document.getElementById("para1").innerHTML = "The array: " + array;
      temp = array[1];
      array[1] = array[0];
      array[0] = temp;
      temp = array[3];
      array[3] = array[2];
      array[2] = temp;
      document.getElementById("para2").innerHTML = "After the array got swapped: " + array;
   </script>
</body>
</html>

使用 Compare() 函数

重新排序数组元素的另一种方法是使用compare()函数。此函数可以作为sort()方法的参数。

但是，sort()方法有一个问题，它不会对整数元素数组进行排序，因为它会将元素转换为字符串，然后使用 UTF-16 代码单元值比较它们的序列。

const array = [12,34,564,1232134];
array.sort();
console.log(array);
// output: [12, 1232134, 34, 564]

使用 sort() 函数

我们可以通过compare 函数来消除这个问题。此函数将根据我们比较的参数返回负值、零或正值。

这是 compare 函数的语法

function(a, b){return a - b}

sort()函数将比较两个值并将值发送到 compare 函数，然后它将根据输出对值进行排序。

  • 如果输出为负数，则 a 将在 b 之前排序。

  • 如果输出为 0（零），则不会发生任何更改。

  • 如果输出为正数，则 b 将在 a 之前排序。

例如，我们有两个值 10、90（a、b），当函数计算 10 – 90 时。输出为负数，因此 sort 函数将把 40 排在 100 之前。

示例

以下是用 compare 函数重新排序数组元素的示例：

<!DOCTYPE html>
<html>
<body>
   <p>Reordering the array in ascending order:</p>
   <button onclick = "Asc()"> Click Asc </button>
   <button onclick = "Desc()"> Click Desc </button>
   <p id="demo1"></p>
   <p id="demo2"></p>
   <script>
      const points = [64, 23, 13, 75, 86];
      function Asc(){
         points.sort(function(a, b){return a - b}); // Ascending order
         document.getElementById("demo1").innerHTML = points;
      }
      function Desc(){
         points.sort(function(a, b){return b - a}); // Descending order
         document.getElementById("demo2").innerHTML = points;
      }
   </script>
</body>
</html>

以上代码的输出将以升序和降序返回数组元素，从而导致数组元素重新排序。

更新于：2022年9月22日

9K+ 次浏览

启动您的 职业生涯

完成课程后获得认证

开始学习
广告