Плохая идея оставить вызовы console.log () в вашем производственном коде JavaScript? - PullRequest
73 голосов
/ 11 июля 2009

У меня есть куча console.log() вызовов в моем JavaScript.

Должен ли я их закомментировать перед развертыванием в производство?

Я бы хотел просто оставить их там, чтобы мне не пришлось снова добавлять комментарии позже, если мне потребуется дополнительная отладка. Это плохая идея?

Ответы [ 11 ]

118 голосов
/ 11 июля 2009

Это приведет к ошибкам Javascript, прекращая выполнение блока Javascript, содержащего ошибку.

Вы можете, однако, определить фиктивную функцию, которая не работает, когда Firebug не активен:

if(typeof console === "undefined") {
    console = { log: function() { } };
}

Если вы используете какие-либо методы, отличные от log, вам также необходимо их отключить.

36 голосов
/ 11 июля 2009

Как уже указывали другие, оставление этого приведет к ошибкам в некоторых браузерах, но эти ошибки можно обойти, вставив некоторые заглушки.

Однако я бы не только закомментировал их, но и полностью удалил эти строки. Просто кажется неаккуратным поступить иначе. Возможно, я педантичен, но я не думаю, что «производственный» код вообще должен включать в себя «отладочный» код, даже в комментариях. Если вы вообще оставляете комментарии, эти комментарии должны описывать то, что делает код, или причины этого, а не блоки отключенного кода. (Хотя большинство комментариев должно быть автоматически удалено в процессе минимизации. Вы минимизируете, верно?)

Кроме того, за несколько лет работы с JavaScript я не могу вспомнить, чтобы когда-либо возвращался к функции и говорил: «Ну и дела, я бы хотел оставить здесь console.logs на месте!» В общем, когда я «закончил» работу над функцией, а потом мне пришлось вернуться к ней, я возвращаюсь, чтобы решить какую-то другую проблему. Какова бы ни была эта новая проблема, если бы консольные журналы из предыдущего раунда работы были бы полезны, то я бы обнаружил проблему в первый раз. Другими словами, если я вернусь к чему-то, мне вряд ли понадобится та же отладочная информация, которая была нужна мне в предыдущих случаях.

Только мои два цента ... Удачи!

10 голосов
/ 12 июля 2009

Если у вас есть сценарий развертывания, вы можете использовать его для удаления вызовов console.log (и минимизации файла).

Пока вы это делаете, вы можете запустить JS через JSLint и регистрировать нарушения для проверки (или предотвращения развертывания).

Это отличный пример того, почему вы хотите автоматизировать развертывание. Если ваш процесс позволяет вам опубликовать файл js с console.logs в нем, в какой-то момент вы сделаете это .

9 голосов
/ 29 января 2011

Насколько мне известно, нет более короткого метода уничтожения console.log, чем следующие 45 символов:

window.console||(console={log:function(){}});

Это первая из трех разных версий, в зависимости от того, какие консольные методы вы хотите отключить, все они крошечные и все были протестированы в IE6 + и современных браузерах.

Другие две версии охватывают различные другие методы консоли. Один охватывает четыре основных принципа, а другой охватывает все известные методы консоли для firebug и webkit. Опять же, в мельчайших размерах файлов.

Этот проект находится на github: https://github.com/andyet/ConsoleDummy.js

Если вы можете придумать какой-либо способ свести к минимуму код дальше, взносы приветствуются.

- РЕДАКТИРОВАТЬ - 16 мая 2012 г.

С тех пор я улучшил этот код. Это все еще крошечный, но добавляет возможность включать и выключать выход консоли: https://github.com/HenrikJoreteg/andlog

Это было , показанное на The Changelog Show

5 голосов
/ 11 июля 2009

Надеюсь, это кому-нибудь поможет - я недавно написал обертку для него, она немного более гибкая, чем принятое решение.

Очевидно, что если вы используете другие методы, такие как console.info и т. Д., Вы можете повторить эффект. когда вы закончите со своей промежуточной средой, просто измените значение по умолчанию C.debug на false для производства, и вам не придется менять какой-либо другой код / ​​выводить строки и т. д. Очень легко вернуться и отладить позже.

var C = {
    // console wrapper
    debug: true, // global debug on|off
    quietDismiss: false, // may want to just drop, or alert instead
    log: function() {
        if (!C.debug) return false;

        if (typeof console == 'object' && typeof console.log != "undefined") {
            console.log.apply(this, arguments); 
        }
        else {
            if (!C.quietDismiss) {
                var result = "";
                for (var i = 0, l = arguments.length; i < l; i++)
                    result += arguments[i] + " ("+typeof arguments[i]+") ";

                alert(result);
            }
        }
    }
}; // end console wrapper.

// example data and object
var foo = "foo", bar = document.getElementById("divImage");
C.log(foo, bar);

// to surpress alerts on IE w/o a console:
C.quietDismiss = true;
C.log("this won't show if no console");

// to disable console completely everywhere:
C.debug = false;
C.log("this won't show ever");
5 голосов
/ 11 июля 2009

Вы должны по крайней мере создать фиктивную console.log, если объект не существует, поэтому ваш код не будет выдавать ошибки на компьютерах пользователей без установленного firebug.

Другой возможностью было бы инициировать ведение журнала только в «режиме отладки», т.е. если установлен определенный флаг:

if(_debug) console.log('foo');
_debug && console.log('foo');
4 голосов
/ 03 декабря 2009

мне кажется, это работает ...

if (!window.console) {
    window.console = {
        log: function () {},
        group: function () {},
        error: function () {},
        warn: function () {},
        groupEnd: function () {}
    };
}
2 голосов
/ 25 июня 2012

Я согласен, что консольная заглушка - хороший подход. Я пробовал различные консольные плагины, фрагменты кода, в том числе довольно сложные. У них у всех были проблемы, по крайней мере, в одном браузере, так что я закончил тем, что сделал что-то простое, как показано ниже, который объединяет другие фрагменты, которые я видел, и некоторые предложения от команды YUI. Похоже, что он работает в IE8 +, Firefox, Chrome и Safari (для Windows).

// To disable logging when posting a production release, just change this to false.
var debugMode = false;

// Support logging to console in all browsers even if the console is disabled. 
var log = function (msg) {
    debugMode && window.console && console.log ? console.log(msg) : null;
};

Примечание: Поддерживается отключение регистрации в консоли через флаг. Возможно, вы могли бы автоматизировать это и с помощью скриптов сборки. В качестве альтернативы, вы можете использовать пользовательский интерфейс или какой-либо другой механизм для переключения этого флага во время выполнения. Конечно, вы можете сделать это намного сложнее, с уровнями журналирования, ajax-передачей журналов на основе порогового значения журнала (например, все операторы уровня ошибок передаются на сервер для хранения там и т. Д.).

Многие из этих тем / вопросов, связанных с ведением журнала, похоже, считают операторы журнала отладочным кодом, а не кодом инструментарий . Отсюда и желание убрать записи журнала. Инструментарий чрезвычайно полезен, когда приложение находится в свободном доступе, и больше не так просто подключить отладчик или информация поступает от пользователя или через службу поддержки. Вы никогда не должны регистрировать что-либо конфиденциальное, независимо от того, где оно было зарегистрировано, поэтому конфиденциальность / безопасность не должны подвергаться риску. Как только вы думаете о регистрации как о инструментарии, она теперь становится рабочим кодом и должна быть написана в том же стандарте.

С приложениями, использующими все более сложный javascript, я считаю, что инструментарий очень важен.

2 голосов
/ 12 июля 2009

Подумал, я бы поделился другой точки зрения. Оставляя этот тип вывода видимым для внешнего мира в приложении PCI, вы становитесь несовместимым.

1 голос
/ 29 января 2011

Как уже упоминалось, в большинстве браузеров возникает ошибка. В Firefox 4 это не выдает ошибку, сообщение регистрируется в консоли веб-разработчика (новое в Firefox 4).

Один из способов обойти такие ошибки, которые мне действительно понравились, был de && bug :

var de = true;
var bug = function() { console.log.apply(this, arguments); }

// within code
de&&bug(someObject);
...