Question

嘿伙计们我是javascript和Jquery的新手一般，到目前为止，我已经习惯使用Object文字了。现在我正在浏览bootstrap modal.js插件的源代码并遇到以下几行代码：

var options = $.extend({}, Modal.DEFAULTS, $this.data(), typeof option == 'object' && option)

您可以在git too上查看这行代码。

现在，这行代码正在创建一个非常复杂的对象文字，在“对象”内部的“对象”内部有很多“对象”，依此类推......基本上是一个嵌套的对象文字。

为了让我完全理解这段代码是必不可少的，我能够console.log对象文字。

我在SO here上看到了一个帖子。

现在我在该答案中看到的打印出一个Object文字的解决方案如下：

for (var key in validation_messages) {
   if (validation_messages.hasOwnProperty(key)) {
       var obj = validation_messages[key];
        for (var prop in obj) {
          // important check that this is objects own property 
          // not from prototype prop inherited
          if(obj.hasOwnProperty(prop)){
            alert(prop + " = " + obj[prop]);
          }
       }
    }
}

现在该解决方案工作正常，如果我有一个对象文字如下：

var validation_messages = {
    "key_1": {
        "your_name": "jimmy",
        "your_msg": "hello world"
    },
    "key_2": {
        "your_name": "billy",
        "your_msg": "foo equals bar"
    }
}

但是，如果我有一个像下面这样的对象文字：

var validation_messages = {
    "key_1": {
        "your_name": "jimmy",
        "your_msg": "hello world"
    },
    "key_2": {
      "your_name": {
        "first_name" : "Ratan",
        "secound_name" : "Tata",
      },
        "your_msg": "foo equals bar"
    }
}

我将在控制台中获得以下内容：

"your_name = jimmy" 
"your_msg = hello world" 
"your_name = [object Object]" 
"your_msg = foo equals bar"

问题是每次键的值是一个对象，我希望循环进入对象并从那里打印键和值，基本上我希望这是递归的。我尝试修改我在该线程中找到的原始代码，但我几乎不知道我在做什么。下面是我修改的代码。

var validation_messages = {
    "key_1": {
        "your_name": "jimmy",
        "your_msg": "hello world"
    },
    "key_2": {
      "your_name": {
        "first_name" : "Ratan",
        "secound_name" : "Tata",
      },
        "your_msg": "foo equals bar"
    }
}


for (var key in validation_messages) {
   if (validation_messages.hasOwnProperty(key)) {
       var obj = validation_messages[key];
        for (var prop in obj) {
          // important check that this is objects own property 
          // not from prototype prop inherited

          if(typeof prop != 'string') {
            for(var obj_key in prop) {
              var obj = prop[obj_key];
               for (var prop in obj){
                  console.log(prop + " = " + obj[prop]);
               }
            }
          }

          if(obj.hasOwnProperty(prop)){
            console.log(prop + " = " + obj[prop]);
          }
       }
    }
}

要重复我的问题，对我来说理解如何以递归方式遍历对象文字并打印出其属性非常重要。

我对对象文字数据显示的想法如下：

data structure

谢谢。

亚历山大。

Answer 1

作为伪代码，解决方案非常简单：

function objectToString(object) {
  string result = '';
  for (key in object) {
    if (hasFields(object[key]))
      result  += objectToString(object[key]);
    else 
      result  += key + ':' + object[key];
  }
}

这里的额外困难是管理演示文稿。一种方法是引入缩进级别。然后可以在每次调用时递增此级别，以获得您寻找的树表示。

在JS中，你可能有这样的代码：

function objectToString(object, level) {
  var prettyString = '',
      tabs = '';
  // We prepare the indentation for the current object
  for (var i=0; i<level; i++) {
      tabs += '\t';
  }

  for (var key in object) {
    prettyString += tabs + key;
    // if the considered field is an object, we call this function with a 
    // greater indentation level
    if (typeof object[key] === 'object') {
      prettyString += '\n';
      prettyString += prettyPrintKeys(object[key], level + 1);
    } else {
      prettyString += ':' + object[key] ;
    }
    prettyString += '\n';
  }
  return prettyString;
}

此功能可用于您的示例：objectToString(validation_messages, 0);

但请注意，虽然这段代码很简单，并且很适合在JS中看到递归，但它并不完整。如果您希望拥有更强大（通用）的解决方案，您可能需要查询the JSON format。

在不使用库的情况下浏览嵌套的对象文字

1 个答案: