如何通过键和值以指定的方式获取对象值

Question

我想以指定的方式打印字符串，但找不到任何方便的解决方案。

我期望得到以下结果：

	<h1>new_data</h1>

     <h4>print:</h4> <span>inv_val_ads_details_brand,auth_sign</span>

     <h4>report:</h4> <span>value_ads_report,per_day_volume_billing</span>

    <h4>media:</h4> <span>media,auto_generated_media</span>


    <hr>


<h1>old_data</h1>

   <h4>media:</h4> <span>meta_data</span>

   <h4>order:</h4> <span>cg_counter,sub_vertical</span>

这是我尝试过的事情：

 var data = {
	"new_data": {
		"print": {
			"inv_val_ads_details_brand": true,
			"auth_sign": false
		},
		"report": {
			"value_ads_report": true,
			"per_day_volume_billing": false
		},
		"media": {
			"media": false,
			"auto_generated_media": true
		}
	},
	"old_data": {
		"media": {
			"meta_data": false
		},
		"order": {
			"cg_counter": true,
			"sub_vertical": false
		}
	}
};

var str = '';

   Object.keys(data).map(function(key) {
        str += '<h1>'+key+'</h1>';

         console.log('main heading...',key);

         Object.keys(data[key]).map(function(val){
              console.log('values',val);
         });
    });

问题：我期望的代码段1输出

请提前帮助我！

Answer 1

由于您什么也没有返回，请使用forEach而不是map，然后执行类似的操作即可得到您要求的输出

堆栈片段

var data = {
  "new_data": {
    "print": {
      "inv_val_ads_details_brand": true,
      "auth_sign": false
    },
    "report": {
      "value_ads_report": true,
      "per_day_volume_billing": false
    },
    "media": {
      "media": false,
      "auto_generated_media": true
    }
  },
  "old_data": {
    "media": {
      "meta_data": false
    },
    "order": {
      "cg_counter": true,
      "sub_vertical": false
    }
  }
};

var str = '';

Object.keys(data).forEach(function(key) {
  str += '<h1>' + key + '</h1>';

  Object.keys(data[key]).forEach(function(val) {
    str += '<h4>' + val + ':</h4>';

    Object.keys(data[key][val]).forEach(function(val2, idx) {
      if (idx > 0) str += ',';
      str += '<span>' + val2 + '</span>';
    });
  });
});

document.body.innerHTML = str;