Question

我正在创建一个包含一堆嵌套对象的对象。使用Web检查器时，我不得不重新定位自己，因为所有这些对象都被称为Object。我的对象树的精简版本如下所示：

v Object
    v fields: Array[3]
        v 0: Object
            v fields: Array[2]
                v 0: Object
                    name: 'name'
                    placeholder: 'name'
                    tag: 'input'
                    type: 'text'
                > 1: Object
            name: 'name'
            tag: 'fieldset'
        > 1: Object
        > 2: Object
    name: 'name'

这变得很快。有没有办法让这个更具可读性/可导航性？如果是这样，它是否有效？像这样：

v form
    v fields: Array[3]
        v 0: fieldset
            v fields: Array[2]
                v 0: input
                     name: 'name'
                     placeholder: 'name'
                     tag: 'input'
                     type: 'text'
                > 1: textarea
            name: 'name'
            tag: 'fieldset'
        > 1: fieldset
        > 2: button
    name: 'name'

或者这只是我要处理的事情？

Answer 1

如果您希望阅读纯文本，可以console.log(JSON.stringify(your_object))。

Answer 2

使用命名函数创建对象：

  var a = {foo:"bar"};
  var b = new function myobj() {
    this.foo = "bar";
  }
  console.log(a,b); // Object, myobj

如果您想要可重复使用的对象，则应使用

  function myobj() {
    this.foo = "bar";
  }
  var objA = new myobj();
  var objB = new myobj();
  console.log(objA,objB); // myobj, myobj

如果您想深入了解差异，请参阅我的问题的this very detailed answer TJ Crowder。

Answer 3

要自动展开所有属性而不是在任何地方阅读Object或Array[l]，一种常见的技术是记录已完成的JSON表示。当您的对象在记录后发生变异时，它还具有不在控制台中更改的优点。你不应该用非常大的对象来做，而且在循环对象上是不可能的。

console.log(JSON.stringify(tree, null, 4));

如何使JavaScript对象更具可读性/可导航性？

3 个答案: