Javascript嵌套对象遍历答案

【问题标题】：Javascript nested object traversalJavascript嵌套对象遍历
【发布时间】：2019-07-20 11:56:55
【问题描述】：

我正在编写一个代码，我必须遍历一个嵌套对象并在一个字符串中返回所有值。例如，如果这是输入：

var obj = {
name: "root",
contents: [
  {
    name: "A",
    contents: [
      {
        name: "fileA1",
        contents: ["Hello!"]
      }
    ]
  },
  {
    name: "B",
    contents: [
      {
        name: "dirB1",
        contents: [
          {
            name: "fileB1.1",
            contents: ["Hello!"]
          }
        ]
      }
    ]
  }
]
};

输出应该是：

root
A
fileA1
Hello!
B
dirB1
fileB1.1
Hello!

我的代码是：

function toArray(obj) {
var result = '';
for (const prop in obj) {
    const value = obj[prop];
    if (typeof value === 'object') {
        result+=(toArray(value)); 
    }
    else {
        result+=(value);
    }
}
//console.log(result);
return result;
}

但是当我运行它时，它会返回以下字符串：

Hello!
fileA1undefined
undefined
Aundefined
Hello!
fileB1.1undefined
undefined
dirB1undefined
undefined
Bundefined
undefinedundefined
rootundefined

为什么我会得到带有值的“未定义”，我该如何解决这个问题？

【问题讨论】：

for..in with array 是一个坏主意，可能要检查一下？。我在某处看到使用 for in for array 会导致不可预测的值，例如 undefined。

标签： javascript object

【解决方案1】：

您可以像这样使用flatMap 和Object.values()：

var obj = {name:"root",contents:[{name:"A",contents:[{name:"fileA1",contents:["Hello!"]}]},{name:"B",contents:[{name:"dirB1",contents:[{name:"fileB1.1",contents:["Hello!"]}]}]}]}

const getValues = o =>
  Object.values(o).flatMap(v => typeof(v) === 'object' ? getValues(v) : v)

console.log(getValues(obj).join('\n'))

如果您将\n 添加到result += value，您的代码将返回所需的结果：

function toArray(obj) {
  var result = '';
  for (const prop in obj) {
    const value = obj[prop];
    if (typeof value === 'object') {
      result += toArray(value);
    } else {
      result += value + '\n';
    }
  }
  return result;
}

var obj = {name:"root",contents:[{name:"A",contents:[{name:"fileA1",contents:["Hello!"]}]},{name:"B",contents:[{name:"dirB1",contents:[{name:"fileB1.1",contents:["Hello!"]}]}]}]}

console.log(toArray(obj))

【讨论】：

【解决方案2】：

运行你的代码我得到了输出

“rootAfileA1Hello！BdirB1fileB1.1Hello！”

所以它在我的浏览器中是不可重现的，但是，您的对象有一些额外的成员，其值为 undefined。所以，让我们添加换行符并避免未定义的值：

var obj = {
name: "root",
contents: [
  {
    name: "A",
    contents: [
      {
        name: "fileA1",
        contents: ["Hello!"]
      }
    ]
  },
  {
    name: "B",
    contents: [
      {
        name: "dirB1",
        contents: [
          {
            name: "fileB1.1",
            contents: ["Hello!"]
          }
        ]
      }
    ]
  }
]
};
function toArray(obj) {
var result = '';
for (const prop in obj) {
    const value = obj[prop];
    if (typeof value === 'object') {
        result+=(toArray(value)); 
    }
    else if (value !== undefined) {
        result+=(value) + "\n";
    }
}
//console.log(result);
return result;
}
toArray(obj);

【讨论】：