JavaScript форматирование данных / симпатичный принтер

Question

Я пытаюсь найти способ pretty print структуры данных JavaScript в удобочитаемой форме для отладки.

У меня довольно большая и сложная структура данных, хранящаяся в JS, и мне нужно написать некоторый код, чтобы манипулировать ею. Для того, чтобы понять, что я делаю и где я ошибаюсь, мне действительно нужно иметь возможность видеть структуру данных во всей ее полноте и обновлять ее всякий раз, когда я делаю изменения через пользовательский интерфейс.

Со всем этим я могу справиться сам, кроме поиска хорошего способа вывести структуру данных JavaScript в удобочитаемую строку. JSON подойдет, но он действительно должен быть красиво отформатирован и иметь отступ. Я бы обычно использовал для этого превосходные DOM-дампы Firebug, но мне действительно нужно было видеть всю структуру сразу, что в Firebug не представляется возможным.

Любые предложения приветствуются.

Заранее спасибо.

Answer 1

Это на самом деле просто комментарий к Джейсону Бантингу "Использовать JSON.stringify Крокфорда", но я не смог добавить комментарий к этому ответу.

Как отмечено в комментариях, JSON.stringify не очень хорошо работает с библиотекой Prototype (www.prototypejs.org). Тем не менее, довольно легко заставить их играть хорошо вместе, временно удалив метод Array.prototype.toJSON, который добавляет прототип, запустив Crocford's stringify (), а затем вернув его обратно так:

  var temp = Array.prototype.toJSON;
  delete Array.prototype.toJSON;
  $('result').value += JSON.stringify(profile_base, null, 2);
  Array.prototype.toJSON = temp;

Answer 2

Взяв на себя инициативу Филио (большое спасибо :)), я закончил тем, что написал свой собственный, так как не мог заставить его делать то, что я хотел. Это довольно грубо и готово, но делает ту работу, которая мне нужна. Спасибо всем за отличные предложения.

Я знаю, что это не блестящий код, но он того стоит. Кто-то может найти это полезным:

// Usage: dump(object)
function dump(object, pad){
    var indent = '\t'
    if (!pad) pad = ''
    var out = ''
    if (object.constructor == Array){
        out += '[\n'
        for (var i=0; i<object.length; i++){
            out += pad + indent + dump(object[i], pad + indent) + '\n'
        }
        out += pad + ']'
    }else if (object.constructor == Object){
        out += '{\n'
        for (var i in object){
            out += pad + indent + i + ': ' + dump(object[i], pad + indent) + '\n'
        }
        out += pad + '}'
    }else{
        out += object
    }
    return out
}

Answer 3

Моя NeatJSON библиотека имеет версии Ruby и JavaScript . Он свободно доступен по (разрешительной) лицензии MIT. Вы можете посмотреть онлайн демо / конвертер по адресу:
http://phrogz.net/JS/neatjson/neatjson.html

Некоторые функции (все дополнительно):

• Обернуть до определенной ширины; если объект или массив может уместиться на строке, он сохраняется на одной строке.
• Совместите двоеточия для всех ключей в объекте.
• Сортировка ключей к объекту в алфавитном порядке.
• Форматирование чисел с плавающей запятой в определенное количество десятичных знаков.
• При переносе используйте «короткую» версию, в которой скобки открытия / закрытия для массивов и объектов располагаются в одной строке с первым / последним значением.
• Контроль пустых пространств для массивов и объектов детальным образом (внутри скобок, до / после двоеточий и запятых).
• Работает в веб-браузере и в качестве модуля Node.js.

Answer 4

Простой для печати элементов в виде строк:

var s = "";
var len = array.length;
var lenMinus1 = len - 1
for (var i = 0; i < len; i++) {
   s += array[i];
   if(i < lenMinus1)  {
      s += ", ";
   }
}
alert(s);

Answer 5

flexjson включает функцию prettyPrint (), которая может дать вам то, что вы хотите.