JavaScript 如何把Map键转换为数组
在JavaScript中,有不同的方法可以将Map键转换为数组。你可以使用map keys()方法来访问Map中的键,然后应用Array form()方法来创建一个访问键的数组。你也可以应用spread操作符来代替Array form()方法来创建一个键的数组。
给你一个javascriptMap,你的任务是把Map上的键转换成数组。下面是一个例子
给定的Map –
{ 1: "India", 2: "Russia", 3: "USA", 4: "Japan", 5: "UK" };
结果阵列 –
[1, 2, 3, 4, 5]
有多种方法可以实现这一目标。其中一些是 –
- 使用Array.form和Map.key()方法
-
使用Spread operator和Map.key()方法
-
使用for…的循环
使用Array.form()和Map.key()方法
Array.from()方法从任何可迭代对象中返回一个数组。而Map.key方法用于以可迭代的形式返回Map的所有键。为了将Map键转换为数组,我们遵循以下步骤。
- 使用Map.key()方法获取所有的Map键。它返回一个包含Map键的MapIterator对象。
-
使用Array.from()从MapIterator中提取Map键。它返回一个包含所有Map键的数组。
例子
在这个例子中,我们有一个Map,其键是数字,值是国家名称。我们使用Array.from方法从Map中提取所有的键(数字)。
<html>
<head>
<title>Example- convert Map keys to an array in JavaScript</title>
</head>
<body>
<h2>Convert Map keys to an array using Array.from method</h2>
<p>Click the following button to get the Keys from the map</p>
<button id="btn" onclick="convert( )" > Click Here </button> <br>
<p id="result"> </p>
<script>
function convert( ){
let result = document.getElementById("result")
let mp = new Map( );
mp.set(1, "India");
mp.set(2, "Russia");
mp.set(3, "USA");
mp.set(4, "Japan");
mp.set(5, "UK");
let keys;
keys = Array.from( mp.keys( ) );
result.innerText = "Converted Array : [ " + keys + " ]";
}
</script>
</body>
</html>
使用扩展运算符和Map.keys()方法
JavaScript的spread操作符允许我们将一个数组扩展为单个数组元素。而Map.key方法是用来以可迭代的形式返回一个Map的所有键。为了将Map键转换为数组,我们遵循以下步骤。
- 使用Map.keys()方法获取所有的Map键。它返回一个包含Map键的MapIterator对象。
-
使用Spread Operator从MapIterator中提取Map键。它返回一个包含所有Map键的数组。
例子
在这个例子中,我们有一个Map,其键是数字,值是国家名称。我们使用Spread Operator从Map中提取所有的键(数字)。
<html>
<head>
<title>Example- convert Map keys to an array in JavaScript</title>
</head>
<body>
<h2>Convert Map keys to an array using Spread Operator</h2>
<p>Click the following button to get the Keys from the map</p>
<button id="btn" onclick="convert( )" > Click Here </button><br>
<p id="result"> </p>
<script>
function convert(){
let result = document.getElementById("result")
let mp = new Map();
mp.set(1, "India");
mp.set(2, "Russia");
mp.set(3, "USA");
mp.set(4, "Japan");
mp.set(5, "UK");
let keys;
keys = [ ...mp.keys() ];
result.innerText = "Converted Array : [ " + keys + " ]";
}
</script>
</body>
</html>
使用for…的循环
for…的 语句在一个可迭代对象的值中循环。Map.key方法被用来以可迭代的形式返回Map的所有键。为了将Map的键转换为数组,我们遵循以下步骤
-
创建一个空的数组来存储键。
-
使用for…的循环遍历所有的Map键,你将从Map.key()方法中得到。
-
在每个迭代中,将该键推入空数组。
例子
<html>
<head>
<title> Example -convert Map keys to an array in JavaScript</title>
</head>
<body>
<h2> Convert Map keys to an array using for...of loop </h2>
<p> Click the following button to get the Keys from the map </p>
<button id="btn" onclick="convert( )" > Click Here </button> <br>
<p id="result"> </p>
<script>
function convert(){
let result = document.getElementById("result")
let mp = new Map();
mp.set(1, "India");
mp.set(2, "Russia");
mp.set(3, "USA");
mp.set(4, "Japan");
mp.set(5, "UK");
let keys = [];
for(let key of mp.keys()){
keys.push(key)
}
result.innerText = "Converted Array : [ " + keys + " ]";
}
</script>
</body>
</html>