如何在 JavaScript 中映射"map"的键/值对？

Question

如何在JavaScript中映射"map"的键/值对：

var map = {"a": 1, "b": 2, "c": 3};
alert(JSON.stringify(map));

我需要在每次迭代中获取一个包含键/值对的映射器：

// ["a_1", "b_2", "c_3"]
map.map((key, value) => key + "_" + value);

Answer 1

这不是一个Map的对象。它只是一个普通对象。因此，使用 Object.entries，然后在键值对上使用map：

const map = {"a": 1, "b": 2, "c": 3};
const mapped = Object.entries(map).map(([k,v]) => `${k}_${v}`);
console.log(mapped);

Object.entries回报：

[["a",1],["b",2],["c",3]]

然后遍历每个内部数组并使用模板文本创建字符串

<小时 />

如果您有Map对象，请使用 Array.from(map) 获取映射的条目，并使用 Array.from 的第二个参数遍历每个条目并创建所需的字符串

Array.from(map, ([k,v]) => `${k}_${v}`)

Answer 2

它不是地图，它是一个对象。(不过，您可以考虑使用Map。

要将其属性作为键/值对获取，可以使用 Object.entries ，然后可以将其应用于map：

map = Object.entries(map).map(([key, value]) => key + "_" + value);

Object.entries相对较新，但对于较旧的环境来说很容易填充。

现场示例：

var map = {"a": 1, "b": 2, "c": 3};
map = Object.entries(map).map(([key, value]) => key + "_" + value);
console.log(map);

---

或者，使用 Map ，您可以使用其内置的 entries 方法，该方法返回一个可迭代对象，将其传递到 Array.from 并使用 Array.from 的映射回调：

var map = new Map([
  ["a", 1],
  ["b", 2],
  ["c", 3]
]);
map = Array.from(map.entries(), ([key, value]) => key + "_" + value);
console.log(map);

(

或者将可迭代对象扩展为数组 ([...map.entries()]  (并在其上使用map，但上述操作避免了临时的一次性数组。

在这两种情况下，我在箭头函数的参数列表中使用解构，该函数接收[key, value]格式的数组。

Answer 3

您可以获取对象的条目并连接键/值对。

var map = { a: 1, b: 2, c: 3 },
    result = Object.entries(map).map(a => a.join('_'));
    
console.log(result);

Answer 4

您可以使用Object.keys给出该对象中存在的键的数组，然后在该数组上使用数组映射方法并访问每个键的值并创建一个字符串

var map = {
  "a": 1,
  "b": 2,
  "c": 3
};
let neObj = Object.keys(map).map(item => `${item}_${map[item]}`)
console.log(neObj)

Answer 5

第一个 [0] 用于位置元素，第二个 [0] 用于名称键或 [1] 用于值等。

console.log([...map][0][0])

例：

var map = {
  "a": 1,
  "b": 2,
  "c": 3
};
console.log([...map][0][0] + "_" + [...map][0][1])

输出：

a_1

Answer 6

或者最简单的形式是，

let list = document.querySelector('ol');
let listitems = list.childNodes;
var list_items_array = Array.from(listitems);
let node_type_map = new Map();
node_type_map.set(1, 'Element');
node_type_map.set(2, 'Attribute');
node_type_map.set(3, 'Text Node');
node_type_map.set(8, 'comment');
node_type_map.set(9, 'Document Itself');
node_type_map.set(10, 'Doctype');
list_items_array.forEach(item => {
    console.log(node_type_map.get(item.nodeType));
})