JavaScript遍历对象时出现[object Object]的原因咨询

嘿，这是个JavaScript里很常见的小细节，我来给你拆解明白：

先看你代码里的核心输出行：

console.log(k + ’ : ’ + t[k]) ;

当你用+运算符把字符串和对象拼接时，JavaScript会自动做「隐式类型转换」——它会调用这个对象的toString()方法，把对象转成字符串才能完成拼接。

而JavaScript里普通的对象（就是你定义的sous这种{}形式的对象），默认的toString()方法返回值就是[object Object]，这就是你看到这个奇怪输出的根本原因！

那为什么数组c能正常显示成1,2,3呢？因为数组的toString()方法被专门重写过了，它会把数组元素用逗号连接起来返回，所以看起来是正常的。

给你几个解决办法，按需选择： #

• 用console.log的多参数形式：它会直接保留对象的原始结构，在控制台里还能展开查看细节：

  for (k in t) {
    console.log(k, ':', t[k]);
  }
  

  这样sous会显示成可展开的对象，而不是转成奇怪的字符串。

• 用JSON.stringify()转成JSON字符串：如果你就是想把对象内容直接拼在字符串里输出，可以用这个方法把对象转成可读性强的JSON格式：

  for (k in t) {
    console.log(k + ' : ' + JSON.stringify(t[k]));
  }
  

  这时sous的输出会是{"foo":"bar","spam":[1,2,{"egg":"42"}]}，能清楚看到所有嵌套内容。

• 递归遍历所有嵌套层级：如果需要把所有嵌套的键值对都逐一输出，可以写个递归函数：

  var t = { "a" : "coucou", "b" : "salut", "c" : [1, 2, 3], "sous" : { "foo" : "bar", "spam" : [ 1,2, {"egg" : "42"}]} };
  
  function traverseObj(obj, parentKey = '') {
    for (const key in obj) {
      const fullKey = parentKey ? `${parentKey}.${key}` : key;
      const value = obj[key];
      if (typeof value === 'object' && value !== null) {
        traverseObj(value, fullKey);
      } else {
        console.log(`${fullKey} : ${value}`);
      }
    }
  }
  
  traverseObj(t);
  

  这个函数会输出所有层级的键值对，比如sous.foo : bar、sous.spam.2.egg : 42这样的格式。

内容的提问来源于stack exchange，提问作者Jamin