Как стать автором
Обновить

Комментарии 16

Скажу честно: как мне кажется, единственная реально полезная обертка над console.log — это ф-я, которая не прекращает работу всех скриптов на сайте из-за забытого вызова console.log :)

Я знаю, по крайней мере, 2 варианта решения проблемы с забытым console.log():

первый:
if(!window.console) window.console = { log: function() {} };

второй:
function log() {
try { window.console.log.apply(window.console, arguments) }
catch(e) { }
}


С первым, по-моему, есть некоторые проблемы в IE8, где объект console исчезает и появляется в зависимости от того, открыты dev тулзы или нет (и соответственно, если они не открыты, то console.log не будет работать до перезагрузки страницы). Про то, что console.log.apply не работает в Fx5 я не знаю — я щас попробовал, вроде как работает. Возможно, нужно просто заменить arguments на Array.prototype.slice.call(arguments) и всё заработает.

А вот откат на alert(), ИМХО, как раз-таки зло, ибо если планируется использовать эту библиотеку в продакшне, то за этот самый alert() юзвери вам скажут большое-пребольшое спасибо, если вдруг кто-то забудет вызов вашей Alert()
Ну и другие очень полезные, но редко используемые методы console, вроде console.dir, ИМХО, зря стороной обошли
Обошёл, потому что они не кроссбраузерные, Хром и FF имеют, остальные придётся изображать теми же логами. Это очень дезориентирует, когда стоит задача — проверить одинаковость работы в браузерах. В продвинутой оболочке ты получаешь выводы их нескольких команд, в остальных оказывается, что надо ещё что-то дописать в отладку. Лучше сразу писать то, что будет видно везде (правда, для алертов это всё равно не верно).

О защите продакшна. Эта система, с алертами, придумана для проекта, который ещё не на продакшне, поэтому совсем некритично оставлять сообщения. Но и это предусмотрено. Первое: общий запрет. Если не писать никаких Alert.go, ни одна команда не сработает, будь даже весь проект — из команд отладки. Начнёт работать только страница, на которой мы разрешим Алерты. Разрешение — по имени хоста localhost, по имени юзера, если они в системе есть. Правильно напишете разрешения (это 1-3 строчки на странице, правда, страниц много) — алерты не пройдут.

Наконец, ничто не мешает полностью удалить alert() (он вообще в 1 строчке проекта) и заменить выводом в DIV, потратив ещё 20-30 строк. Почему не 10? Потому что надо обойти случай сообщений до ready, накапливать куда-то в буфер. И вообще, позаботиться о качестве и информативности. Когда-то писал такое для IE6 и выше, но забросил там, где писал. Ничего там сложного нет, кроме особенностей DOM. Но и этот вывод может испугать пользователя и блокировать его работу, если не позаботиться об элементарном перехвате :).

IE8 — да, ведёт себя так — сыплет алертами. Причём, если DebugBar закроешь, снова к алертам не переходит до перезагрузки бр-ра. FF3.6 тоже — если Firebug не открыт, посылает алерты. 5-й — ничего не сыплет, пока не откроешь Fifebug, тогда начинает идти в консоль. Но писали про баг с 4-м FF этого рода — то ли алерты сыплет, то ли ошибки. Вот в этом зоопарке и приходится отлаживать. Тем не менее, такая функция — наиболее удобна по своей простоте и выключаемости. Кроме того, в выключенном состоянии работает быстро (проверка своего 1 свойства — и назад).

Баг с FF5 был на Win7/64. Наверное, и есть, если не было какого0то тихого обновления (они сейчас есть в Фоксе?). Сейчас проверил на WinXp/FF5 — бага нет. Может, это был баг Firebug, его недавно обновляли (добавили баги новые! :) ). Проверяется строчкой Alert(1,2,3,4,5,6,7,8); Если нет «8» — есть баг. На работе был, надо завтра будет проверить его ещё раз и Ваше предложение по правке.
Ну и кстати в Fx начиная с 4 версии есть встроенная веб-консоль, которая вызывается, кажется, но Shift+Ctrl+K (Shift+Cmd+K). По крайней мере, она так не течет, как firebug :)
А чем это плохо?:
        
log : function(v){
    if (typeof console != 'undefined') return console.log(v);
},
есть у Firebug фича, которую крайне сложно найти в описаниях, если не знаешь, как она называется. Называется она «debugger;».

Эта фича есть в ECMA-262-5 и поддерживается как в Fx, так и в IE.
Спасибо, ученье — свет :). Так и напишу. Однажды забыл её название и не мог вспомнить с поисковиком :).
Она работает во всех популярных браузерах.
Спасибо, ученье — свет :). Так и напишу. Однажды забыл её название и не мог вспомнить с поисковиком :).
Хм, сообщение минуту-другую не отображалось, поэтому запустил ещё раз.

Вышел Firebug 1.8, blog.getfirebug.com/2011/07/29/firebug-1-8-0/, ещё 29-го, на Хабре об этом нет. Только в пятницу думал, когда исправят привнесённые в 1.7.3 баги.
Класс, спасибо!
НЛО прилетело и опубликовало эту надпись здесь
… Недавно тут FF5 (или firebug?) испортил картину, отказавшись понимать console.log.apply, пришлось дописать некрасивую альтернативу. Как обойти баг, не придумал, да и не обязательно.

Я сделал так:
Function.prototype.apply.call(original[methodName], original, arguments);
Лично я для себя написал такую вот обертку:

  1. function log(){ return myconsole._console('log',arguments); }
  2. function info(){ return myconsole._console('info',arguments); }
  3. function warn(){ return myconsole._console('warn',arguments); }
  4. function error(){ return myconsole._console('error',arguments); }
  5.  
  6.  
  7. myconsole._console = function (f,args){
  8.     if (!console) return;
  9.     try{
  10.         console[f].apply(console,args);
  11.     }catch(IEFuckingConsole){
  12.         for (var i=0,l=args.length;i<l;i++){
  13.             if (f=='log')
  14.                 myconsole.dump(args[i]);
  15.             else
  16.                 console[f](args[i]);
  17.         }
  18.     }
  19. };
  20.  
  21. myconsole.dump = function(o){
  22.     if(typeof o == 'string')
  23.         return console.info('-DUMP: ',o);
  24.     var ss;
  25.     s = o+"\n{\n";
  26.     for (var i in o){
  27.         if (typeof o[i] == 'function')
  28.         {
  29.             try {
  30.                 ss = substr(0,64).replace(/[\r\n\t]+/g,' ')+'...}';
  31.             }catch(c){
  32.                 ss = 'function(){...}';
  33.             }
  34.         }
  35.         else
  36.             ss = o[i];
  37.         s += "\t"+i+': '+ss+"\n";
  38.     }
  39.     s+="}";
  40.     console.clear();
  41.     console.info('DUMP: ',s);
  42. };
  43.  


myconsole.dump — чтобы в IE хоть как-то получить представление об объекте, а не просто запись
Журнал: [object Object]
Зарегистрируйтесь на Хабре, чтобы оставить комментарий

Публикации