Javascript对象的实时可视化工具

和许多人一样，我的大脑倾向于在阅读、写作和创作时处理视觉信息，也就是非文本信息

有哪些工具可以让我以某种方式直观地查看当前运行的javascript环境

一个明显的例子是，只需在屏幕或HTML页面上放置一个框来表示当前内存中的每个对象。该框可能包含一个标签，该标签是当前绑定到对象的变量。如果我使用的是pubsub库，当它所代表的对象收到它订阅的消息时，该框可能会瞬间闪烁。单击该框可能会给出该对象的所有公共方法的列表，如果代码有方法签名注释，我将看到其参数的名称

---

欢迎在Javascript中使用与此类似的任何东西并在当前运行的进程上运行！此外，它必须是一个javscript库的形式，我可以将其附加到现有的代码中，但这种工具的示例（如某些IDE或浏览器插件中的示例）是受欢迎的。

尽管它不使用框，可能会节省屏幕空间，但您有没有给firebug一个机会？虽然它们不是图形框，但它使用可展开/可折叠的文本元素来帮助可视化应用程序

而且它并不局限于JS。您可以使用元素选择器来选择html元素，并查看JS实际上是如何改变DOM的。比如说聚焦，你将一些css应用到文本框中；您可以使用Firebug实时看到这一点

它确实是一个非常有用的工具。你可以一行一行地调试你的JS，在变量上放置手表来查看它们的所有方法和值；要查看它们的值是如何实时更改的，或者在程序运行时自己更改它们！，看看html和js是如何被近实时读取和影响的，还有更多。。。还有一些插件，或者至少用来帮助调试其他语言，特别是我想起了一个actionscript插件，它让我看到FLASH/SWF对象发生时的轨迹，还有一个PHP插件

如果你还没试过的话。你必须这样做

如果你对低级的东西更感兴趣；正如下面详细介绍的HTTP调用一样；复制慢速连接；假装你的用户代理可以在大多数浏览器上完成，但也没有这个！那就试试小提琴2。。。我不经常使用它，但当我处理难以解决的AJAX或http问题时，有很多来回调用，它一直是一个救命稻草

---

希望这能有所帮助。

您可以列出一些对象方法，例如使用my object Explorer bookmarklet玩扑克牌，这是intersting idea的链接，可以让它成为动画和生活。它可能已经非常缓慢地挖掘出深层属性，生活可能太多了。。。