如何在JavaScript中排序Map?


在JavaScript中,Map是一种数据结构,它以键值对的形式存储值。它可以存储所有类型的数据,无论是原始类型还是JavaScript对象。它按照插入元素的顺序存储元素,因此,当我们迭代其元素时,它会按照我们存储元素的相同顺序打印元素。

正如我们所讨论的,Map中存储的元素顺序与我们在该Map中插入元素的顺序相同。但是,我们也可以根据不同键的值按任何顺序对Map的元素进行排序。我们可以使用JavaScript的自定义sort()方法根据存储的键值对Map元素进行排序。

语法

下面的语法将向您展示如何在JavaScript中创建一个Map:

var map_name = new Map([...myMap].sort(cmp));

这里map_name是已排序的Map,myMap是原始Map,cmp是用于比较Map中两个值的比较函数。

步骤

按照以下步骤在JavaScript中排序Map:

  • 步骤1 - 定义一个包含一些默认值的Map。

var myMap = new Map([
   [20, 8],
   [9, 5],
   [3, 9],
   [13, 0],
]);
  • 步骤2 - 定义一个比较函数。此函数用于比较两个元素。

function cmp(a, b) {
   return a[0] - b[0];
}
function cmp(a, b) {
   return a[0] - b[0];
}
  • 步骤3 - 使用Map()构造函数从现有的Map myMap创建一个新的对象sortedMap。此步骤包含三个子步骤:

  • 步骤3.1 - 首先,使用展开语法[…myMap]通过将Map myMap的元素展开到数组中来创建一个数组。

  • 步骤3.2 - 接下来,调用sort()函数并传入比较函数cmp。

  • 步骤3.3 - 最后,使用Map构造函数构造一个新的Map sortedMap。sortedMap包含已排序的数组。

sortedMap = new Map([...myMap].sort(cmp));
  • 步骤4 - 显示Map的已排序元素。

现在让我们通过代码示例来了解如何在JavaScript中排序Map:

示例

下面的示例将向您解释如何按Map中键值的升序或递增顺序对Map进行排序:

<html>
<body>
   <h2>Sorting keys in a map in JavaScript</h2>
   <p id = "prev">The initial order of values of keys in map is:</p>
   <p id = "result">The final sorted order of values of keys in map is:</p>
   <script>
      var result = document.getElementById("result");
      var prev = document.getElementById("prev");
      var myMap = new Map([
         [20, 8],
         [9, 5],
         [3, 9],
         [13, 0],
      ]);

      for (var [key, value] of myMap) {
         prev.innerHTML += " <b> " + key + " </b> ";
      }

      function cmp(a, b) {
        return a[0] - b[0];
      }

      sortedMap = new Map([...myMap].sort(cmp));

      for (var [key, value] of sortedMap) {
         result.innerHTML += " <b> " + key + " </b> ";
      }
   </script>
</body>
</html>

在上面的示例中,我们使用了sort()方法,它使用我们用来定义元素排序顺序的cmp函数,以升序或递增顺序对元素进行排序。

现在让我们讨论另一个代码示例,在这个示例中,我们将按降序或递减顺序对Map的元素进行排序。

方法

此示例和上一个示例的方法几乎相同,您只需要进行一些小的更改。您需要在上一个算法中进行的更改是将cmp函数中的返回值从a[0] – b[0]更改为b[0] - a[0]。通过更改此值,它将按递减或降序对元素进行排序。

示例

下面的示例将说明如何按递减顺序对Map的键元素的值进行排序:

<html>
<body>
   <h2>Sorting a map in JavaScript</h2>
   <p>Enter any two numbers:</p>
   <input type = "number" id = "inp1"> <br> <br>
   <input type = "number" id = "inp2"> <br> <br>
   <button id = "btn" onclick = "mapSort()"> click to sort </button>
   <p id = "prev">The initial order of values of keys in map is:</p>
   <p id = "result">The final sorted order of values of keys in map is:</p>
   <script>
      var result = document.getElementById("result");
      var prev = document.getElementById("prev");
      function mapSort() {
         var myMap = new Map([
            [20, 8],
            [9, 5],
            [3, 9],
         ]);
         var inp1 = document.getElementById("inp1");
         var inp2 = document.getElementById("inp2");
         var val1 = inp1.value;
         var val2 = inp2.value;
         var num1 = Number(val1);
         var num2 = Number(val2);
         myMap.set(num1, num2);

         for (var [key, value] of myMap) {
            prev.innerHTML += " <b> " + key + " </b> ";
         }

         function cmp(a, b) {
            return b[0] - a[0];
         }

         myMap = new Map([...myMap].sort(cmp));

         for (var [key, value] of myMap) {
            result.innerHTML += " <b> " + key + " </b> ";
         }
      }
   </script>
</body>
</html>

在上面的示例中,我们通过将cmp函数传递给sort()方法,以递减或降序对Map中存储的键元素的值进行排序,使其首先返回较大的值,然后返回较小的值。

结论

在本文中,我们学习了如何使用sort()方法在JavaScript中对Map进行排序。我们已经实际实现了它,并按递减和递增顺序对Map进行了排序。

更新于:2023年11月20日

1K+ 次浏览

启动您的职业生涯

通过完成课程获得认证

开始
广告
© . All rights reserved.