如何在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进行了排序。
数据结构
网络
关系数据库管理系统 (RDBMS)
操作系统
Java
iOS
HTML
CSS
Android
Python
C语言编程
C++
C#
MongoDB
MySQL
Javascript
PHP