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

我用一堆嵌套对象创建一个对象。在与网络检查员一起工作时，我经常不得不重新调整方向，因为所有这些对象都被简称为Object。我的对象树的缩写版本如下所示：如何让JavaScript对象更具可读性/可导航性？

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'

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

来源

2013-06-20 Marcus McLean

您的意思是你想要一个DOM树吗？ – bfavaretto

那么，对象是'Object's - 检查员写出'.constructors'名称。但是我想为了简单的调试改变你的代码库并没有什么意义。 – Bergi

不，我正在做一个DOM树的对象来操作服务器端。 –

要自动扩展所有属性，而不是在任何地方都读取Object或Array[l]，常用技巧是记录令人满意的JSON表示。它还具有在对象在登录后发生变化时不会在控制台中进行更改的好处。你不应该使用非常大的对象来做它，并且这对循环对象来说是不可能的。

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

来源

2013-06-20 17:01:06 Bergi

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

来源

2013-06-20 16:45:25

使用命名函数来创建对象：

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

如果你想深入了解的差异，看到TJ的this very detailed answer克罗德对我的问题。

来源

2013-06-20 16:47:10

如何（中）效率是这样做的？ –

@MarcusMcLean查看我答案的更新。 –

@Marcus：当然，它比使用Object文字效率低得多，但你也可以获得继承。我不会在纯数据对象上推荐它，但是，例如从简单的JSON字符串解析。 – Bergi

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

回答

相关问题