Vue如何循环map对象的key和value

千年码农
  • 2
新手上路,请多包涵

如题在面试前端工程师过程中问道,如果循环一个对象的key value?

回复
阅读 534
4 个回答

是问对象还是Map?对象的话直接v-for,map的话先转成对象

是js循环还是式vue指令的循环

如果只是对象你可以用 for...in 来操作,也可以用 for...of + Object.entries()

var obj = {a:1, b:2, c:3};

for (let prop in obj) {
  console.log(`obj.${prop} =  ${obj[prop]}`);
}
// "obj.a = 1"
// "obj.b = 2"
// "obj.c = 3"

for (const [key, value] of Object.entries(obj)) {
  console.log(`obj.${key} = ${value}`);
}
// "obj.a = 1"
// "obj.b = 2"
// "obj.c = 3"

如果你说的是Map结构的对象,可以直接用 for 循环来输出

const map = new Map([
  ['F', 'no'],
  ['T',  'yes'],
]);

for (let [key, value] of map.entries()) {
  console.log(`map.get(${key}) = ${value}`);
}
// "map.get(F) = no"
// "map.get(T) = yes"

// 等同于使用map.entries()
for (let [key, value] of map) {
  console.log(`map.get(${key}) = ${value}`);
}
// "map.get(F) = no"
// "map.get(T) = yes"

// 如果要求不高也可以直接展开
[...map.entries()]
// [[1,'one'], [2, 'two'], [3, 'three']]

[...map]
// [[1,'one'], [2, 'two'], [3, 'three']]

相关文档:

for...in - JavaScript | MDN
for...of - JavaScript | MDN
Object.entries() - JavaScript | MDN
Set 和 Map 数据结构 - ECMAScript 6入门

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
你知道吗?

宣传栏