Дамп объектов или сделаем жизнь проще

Зачастую при отладке js-скриптов нам нужно получить развёрнутый дамп того или иного объекта. Не менее полезной является возможность навигации по дереву DOM, свойствам объектов и т.д. Обычно такой функционал на себя берут плагины к браузерам, вроде firebug для лисы. Но браузеров много и их кол-во постоянно растёт. Написание кроссбраузерных скриптов становится всё менее тривиальной задачей. Поэтому я попробовал частично решить проблему через скрипт, способный выводить дамп объектов в виде topmost div-ов с синтаксической подсветкой типов, возможностью навигации практически во всех современных браузерах. Для пущего удобства в движок был вставлен код, выводящий стёк вызовов с аргументами функций.

Скрипт (Dump.js) использует глобальную переменную Uses как контейнер модулей, одним из которых он и является. Доступ к нему можно получить обращаясь к Uses.Dump. Основной функцией, необходимой в повседневной работе является Dump().

Uses.Dump.Dump = function (Obj, ObjName);
// Obj - объект для дампа
// ObjName - имя объекта, которое будет показано в верхней части панели

Скрипт позволяет делать множество снимков (дампов), каждый из которых имеет всё больший приоритет topmost на экране. Навигация между ними осуществляется посредством select-a, который привязан к левому верхнему углу экрана. Пример вызова функции Dump на тестовом объекте: Смотреть

Слева от каждого элемента расположена пара кнопок "O" и "V", позволяющих просмотреть содержимое дочернего объекта/свойства в одном из двух режимов: "O" - режим объекта, "V" - режим значения. Так, просмотр Test.obj в объектном режиме отобразит список свойств объекта, а в режиме значения строку: "object ТипОбъекта".

Просмотр функции выводит её код с учётом форматирования. Все особые символы экранируются.

Исходный код скрипта (13.4 КБ) прилагается.