'consola' es un error indefinido para Internet Explorer

Estoy usando Firebug y tengo algunas declaraciones como:

console.log("...");

en mi pagina En IE8 (probablemente versiones anteriores también) recibo errores de script que dicen que 'consola' no está definida. Intenté poner esto en la parte superior de mi página:

<script type="text/javascript">
    if (!console) console = {log: function() {}};
</script>

Todavía me salen los errores. ¿Alguna forma de deshacerse de los errores?

Tratar

if (!window.console) console = ...

Una variable indefinida no se puede referir directamente. Sin embargo, todas las variables globales son atributos del mismo nombre del contexto global ( windowen el caso de los navegadores), y acceder a un atributo indefinido está bien.

O use if (typeof console === 'undefined') console = ...si desea evitar la variable mágica window, vea la respuesta de @Tim Down .

Pegue lo siguiente en la parte superior de su JavaScript (antes de usar la consola):

/**
 * Protect window.console method calls, e.g. console is not defined on IE
 * unless dev tools are open, and IE doesn't define console.debug
 * 
 * Chrome 41.0.2272.118: debug,error,info,log,warn,dir,dirxml,table,trace,assert,count,markTimeline,profile,profileEnd,time,timeEnd,timeStamp,timeline,timelineEnd,group,groupCollapsed,groupEnd,clear
 * Firefox 37.0.1: log,info,warn,error,exception,debug,table,trace,dir,group,groupCollapsed,groupEnd,time,timeEnd,profile,profileEnd,assert,count
 * Internet Explorer 11: select,log,info,warn,error,debug,assert,time,timeEnd,timeStamp,group,groupCollapsed,groupEnd,trace,clear,dir,dirxml,count,countReset,cd
 * Safari 6.2.4: debug,error,log,info,warn,clear,dir,dirxml,table,trace,assert,count,profile,profileEnd,time,timeEnd,timeStamp,group,groupCollapsed,groupEnd
 * Opera 28.0.1750.48: debug,error,info,log,warn,dir,dirxml,table,trace,assert,count,markTimeline,profile,profileEnd,time,timeEnd,timeStamp,timeline,timelineEnd,group,groupCollapsed,groupEnd,clear
 */
(function() {
  // Union of Chrome, Firefox, IE, Opera, and Safari console methods
  var methods = ["assert", "cd", "clear", "count", "countReset",
    "debug", "dir", "dirxml", "error", "exception", "group", "groupCollapsed",
    "groupEnd", "info", "log", "markTimeline", "profile", "profileEnd",
    "select", "table", "time", "timeEnd", "timeStamp", "timeline",
    "timelineEnd", "trace", "warn"];
  var length = methods.length;
  var console = (window.console = window.console || {});
  var method;
  var noop = function() {};
  while (length--) {
    method = methods[length];
    // define undefined methods as noops to prevent errors
    if (!console[method])
      console[method] = noop;
  }
})();

La envoltura de cierre de la función es abarcar las variables para no definir ninguna variable. Esto protege tanto contra indefinido consolecomo indefinido console.debug(y otros métodos faltantes).

EDITAR: Noté que HTML5 Boilerplate usa un código similar en su archivo js / plugins.js, si está buscando una solución que (probablemente) se mantenga actualizada.

Otra alternativa es el typeofoperador:

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

Otra alternativa es utilizar una biblioteca de registro, como mi propio log4javascript .

Para una solución más robusta, use este código (tomado del código fuente de twitter):

// Avoid `console` errors in browsers that lack a console.
(function() {
    var method;
    var noop = function () {};
    var methods = [
        'assert', 'clear', 'count', 'debug', 'dir', 'dirxml', 'error',
        'exception', 'group', 'groupCollapsed', 'groupEnd', 'info', 'log',
        'markTimeline', 'profile', 'profileEnd', 'table', 'time', 'timeEnd',
        'timeStamp', 'trace', 'warn'
    ];
    var length = methods.length;
    var console = (window.console = window.console || {});

    while (length--) {
        method = methods[length];

        // Only stub undefined methods.
        if (!console[method]) {
            console[method] = noop;
        }
    }
}());

En mis guiones, uso la abreviatura:

window.console && console.log(...) // only log if the function exists

o, si no es posible o factible editar cada línea de console.log, creo una consola falsa:

// check to see if console exists. If not, create an empty object for it,
// then create and empty logging function which does nothing. 
//
// REMEMBER: put this before any other console.log calls
!window.console && (window.console = {} && window.console.log = function () {});

Puede usarlo console.log()si tiene Developer Toolsabierto en IE8 y también puede usar el Consolecuadro de texto en la pestaña de secuencia de comandos.

if (typeof console == "undefined") {
  this.console = {
    log: function() {},
    info: function() {},
    error: function() {},
    warn: function() {}
  };
}

Basado en dos respuestas anteriores de

• Vinícius Moraes
• Peter Tseng

y las documentaciones para

• Internet Explorer (IE 10)
• Safari (2012. 07. 23.)
• Firefox (2013. 05. 20.)
• Chrome (2013. 01. 25.) y Chrome (2012. 10. 04.)
• y algo de mi conocimiento

Aquí hay una implementación del mejor esfuerzo para el problema, lo que significa que si hay un console.log que realmente existe, llena los vacíos para los métodos no existentes a través de console.log.

Por ejemplo, para IE6 / 7, puede reemplazar el registro con alerta (estúpido pero funciona) y luego incluir el siguiente monstruo (lo llamé console.js): [Siéntase libre de eliminar los comentarios como mejor le parezca, los dejé como referencia, un minimizador puede abordarlos]:

<!--[if lte IE 7]>
<SCRIPT LANGUAGE="javascript">
    (window.console = window.console || {}).log = function() { return window.alert.apply(window, arguments); };
</SCRIPT>
<![endif]-->
<script type="text/javascript" src="console.js"></script>

y console.js:

    /**
     * Protect window.console method calls, e.g. console is not defined on IE
     * unless dev tools are open, and IE doesn't define console.debug
     */
    (function() {
        var console = (window.console = window.console || {});
        var noop = function () {};
        var log = console.log || noop;
        var start = function(name) { return function(param) { log("Start " + name + ": " + param); } };
        var end = function(name) { return function(param) { log("End " + name + ": " + param); } };

        var methods = {
            // Internet Explorer (IE 10): http://msdn.microsoft.com/en-us/library/ie/hh772169(v=vs.85).aspx#methods
            // assert(test, message, optionalParams), clear(), count(countTitle), debug(message, optionalParams), dir(value, optionalParams), dirxml(value), error(message, optionalParams), group(groupTitle), groupCollapsed(groupTitle), groupEnd([groupTitle]), info(message, optionalParams), log(message, optionalParams), msIsIndependentlyComposed(oElementNode), profile(reportName), profileEnd(), time(timerName), timeEnd(timerName), trace(), warn(message, optionalParams)
            // "assert", "clear", "count", "debug", "dir", "dirxml", "error", "group", "groupCollapsed", "groupEnd", "info", "log", "msIsIndependentlyComposed", "profile", "profileEnd", "time", "timeEnd", "trace", "warn"

            // Safari (2012. 07. 23.): https://developer.apple.com/library/safari/#documentation/AppleApplications/Conceptual/Safari_Developer_Guide/DebuggingYourWebsite/DebuggingYourWebsite.html#//apple_ref/doc/uid/TP40007874-CH8-SW20
            // assert(expression, message-object), count([title]), debug([message-object]), dir(object), dirxml(node), error(message-object), group(message-object), groupEnd(), info(message-object), log(message-object), profile([title]), profileEnd([title]), time(name), markTimeline("string"), trace(), warn(message-object)
            // "assert", "count", "debug", "dir", "dirxml", "error", "group", "groupEnd", "info", "log", "profile", "profileEnd", "time", "markTimeline", "trace", "warn"

            // Firefox (2013. 05. 20.): https://developer.mozilla.org/en-US/docs/Web/API/console
            // debug(obj1 [, obj2, ..., objN]), debug(msg [, subst1, ..., substN]), dir(object), error(obj1 [, obj2, ..., objN]), error(msg [, subst1, ..., substN]), group(), groupCollapsed(), groupEnd(), info(obj1 [, obj2, ..., objN]), info(msg [, subst1, ..., substN]), log(obj1 [, obj2, ..., objN]), log(msg [, subst1, ..., substN]), time(timerName), timeEnd(timerName), trace(), warn(obj1 [, obj2, ..., objN]), warn(msg [, subst1, ..., substN])
            // "debug", "dir", "error", "group", "groupCollapsed", "groupEnd", "info", "log", "time", "timeEnd", "trace", "warn"

            // Chrome (2013. 01. 25.): https://developers.google.com/chrome-developer-tools/docs/console-api
            // assert(expression, object), clear(), count(label), debug(object [, object, ...]), dir(object), dirxml(object), error(object [, object, ...]), group(object[, object, ...]), groupCollapsed(object[, object, ...]), groupEnd(), info(object [, object, ...]), log(object [, object, ...]), profile([label]), profileEnd(), time(label), timeEnd(label), timeStamp([label]), trace(), warn(object [, object, ...])
            // "assert", "clear", "count", "debug", "dir", "dirxml", "error", "group", "groupCollapsed", "groupEnd", "info", "log", "profile", "profileEnd", "time", "timeEnd", "timeStamp", "trace", "warn"
            // Chrome (2012. 10. 04.): https://developers.google.com/web-toolkit/speedtracer/logging-api
            // markTimeline(String)
            // "markTimeline"

            assert: noop, clear: noop, trace: noop, count: noop, timeStamp: noop, msIsIndependentlyComposed: noop,
            debug: log, info: log, log: log, warn: log, error: log,
            dir: log, dirxml: log, markTimeline: log,
            group: start('group'), groupCollapsed: start('groupCollapsed'), groupEnd: end('group'),
            profile: start('profile'), profileEnd: end('profile'),
            time: start('time'), timeEnd: end('time')
        };

        for (var method in methods) {
            if ( methods.hasOwnProperty(method) && !(method in console) ) { // define undefined methods as best-effort methods
                console[method] = methods[method];
            }
        }
    })();

En IE9, si la consola no está abierta, este código:

alert(typeof console);

mostrará "objeto", pero este código

alert(typeof console.log);

lanzará la excepción TypeError, pero no devolverá un valor indefinido;

Entonces, la versión garantizada del código será similar a esto:

try {
    if (window.console && window.console.log) {
        my_console_log = window.console.log;
    }
} catch (e) {
    my_console_log = function() {};
}

Solo estoy usando console.log en mi código. Así que incluyo un 2 liner muy corto

var console = console || {};
console.log = console.log || function(){};

Noté que OP está usando Firebug con IE, así que suponga que es Firebug Lite . Esta es una situación funky ya que la consola se define en IE cuando se abre la ventana del depurador, pero ¿qué sucede cuando Firebug ya se está ejecutando? No estoy seguro, pero quizás el método "firebugx.js" podría ser una buena forma de probar en esta situación:

fuente:

https://code.google.com/p/fbug/source/browse/branches/firebug1.2/lite/firebugx.js?r=187

    if (!window.console || !console.firebug) {
        var names = [
            "log", "debug", "info", "warn", "error", "assert",
            "dir","dirxml","group","groupEnd","time","timeEnd",
            "count","trace","profile","profileEnd"
        ];
        window.console = {};
        for (var i = 0; i < names.length; ++i)
            window.console[names[i]] = function() {}
    }

(enlaces actualizados 20/2014)

Estoy usando fauxconsole ; Modifiqué un poco el CSS para que se vea mejor pero funcione muy bien.

Para depurar en IE, consulte este log4javascript

Para IE8 o soporte de consola limitado a console.log (sin depuración, seguimiento, ...) puede hacer lo siguiente:

• Si la consola O console.log no está definida: cree funciones ficticias para las funciones de la consola (rastreo, depuración, registro, ...)

  window.console = { debug : function() {}, ...};

• De lo contrario, si console.log está definido (IE8) Y console.debug (cualquier otro) no está definido: redirija todas las funciones de registro a console.log, ¡esto permite mantener esos registros!

  window.console = { debug : window.console.log, ...};

No estoy seguro sobre el soporte de afirmación en varias versiones de IE, pero cualquier sugerencia es bienvenida. También publiqué esta respuesta aquí: ¿Cómo puedo usar el inicio de sesión de consola en Internet Explorer?

console = console || { 
    debug: function(){}, 
    log: function(){}
    ...
}

Trozo de consola en TypeScript:

if (!window.console) {
console = {
    assert: () => { },
    clear: () => { },
    count: () => { },
    debug: () => { },
    dir: () => { },
    dirxml: () => { },
    error: () => { },
    group: () => { },
    groupCollapsed: () => { },
    groupEnd: () => { },
    info: () => { },
    log: () => { },
    msIsIndependentlyComposed: (e: Element) => false,
    profile: () => { },
    profileEnd: () => { },
    select: () => { },
    time: () => { },
    timeEnd: () => { },
    trace: () => { },
    warn: () => { },
    }
};

Puede usar el siguiente para dar un grado adicional de seguro que tiene todas las bases cubiertas. Usar typeofprimero evitará cualquier undefinederror. El uso ===también garantizará que el nombre del tipo sea en realidad la cadena "indefinida". Finalmente, querrá agregar un parámetro a la firma de la función (elegí logMsgarbitrariamente) para garantizar la coherencia, ya que pasa lo que desee impreso a la consola a la función de registro. Esto también lo mantiene intellisense preciso y evita advertencias / errores en su IDE JS.

if(!window.console || typeof console === "undefined") {
  var console = { log: function (logMsg) { } };
}

Algunas veces la consola funcionará en IE8 / 9 pero fallará en otras ocasiones. Este comportamiento errático depende de si tiene abiertas herramientas de desarrollador y se describe en la pregunta de stackoverflow ¿IE9 admite console.log, y es una función real?

Se encontró un problema similar al ejecutar console.log en ventanas secundarias en IE9, creado por la función window.open.

Parece que en este caso la consola se define solo en la ventana principal y no está definida en las ventanas secundarias hasta que las actualice. Lo mismo se aplica a los hijos de ventanas infantiles.

Abordo este problema envolviendo el registro en la siguiente función (a continuación se muestra un fragmento del módulo)

getConsole: function()
    {
        if (typeof console !== 'undefined') return console;

        var searchDepthMax = 5,
            searchDepth = 0,
            context = window.opener;

        while (!!context && searchDepth < searchDepthMax)
        {
            if (typeof context.console !== 'undefined') return context.console;

            context = context.opener;
            searchDepth++;
        }

        return null;
    },
    log: function(message){
        var _console = this.getConsole();
        if (!!_console) _console.log(message);
    }

Después de tener tantos problemas con esto (es difícil depurar el error ya que si abres la consola del desarrollador, ¡el error ya no ocurre!) Decidí crear un código excesivo para no tener que volver a molestarme con esto nunca más:

if (typeof window.console === "undefined")
    window.console = {};

if (typeof window.console.debug === "undefined")
    window.console.debug= function() {};

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

if (typeof window.console.error === "undefined")
    window.console.error= function() {alert("error");};

if (typeof window.console.time === "undefined")
    window.console.time= function() {};

if (typeof window.console.trace === "undefined")
    window.console.trace= function() {};

if (typeof window.console.info === "undefined")
    window.console.info= function() {};

if (typeof window.console.timeEnd === "undefined")
    window.console.timeEnd= function() {};

if (typeof window.console.group === "undefined")
    window.console.group= function() {};

if (typeof window.console.groupEnd === "undefined")
    window.console.groupEnd= function() {};

if (typeof window.console.groupCollapsed === "undefined")
    window.console.groupCollapsed= function() {};

if (typeof window.console.dir === "undefined")
    window.console.dir= function() {};

if (typeof window.console.warn === "undefined")
    window.console.warn= function() {};

Personalmente, solo uso console.log y console.error, pero este código maneja todas las demás funciones como se muestra en la red de desarrolladores de Mozzila: https://developer.mozilla.org/en-US/docs/Web/API/console . Simplemente ponga ese código en la parte superior de su página y habrá terminado para siempre con esto.

Puede usar console.log (...) directamente en Firefox pero no en IE. En IE, debe usar window.console.