significa - ¿Cómo imprimo mensajes de depuración en la Consola de JavaScript de Google Chrome?
que significa paused in debugger (14)
¿Cómo imprimo mensajes de depuración en la Consola de JavaScript de Google Chrome?
Tenga en cuenta que la Consola de JavaScript no es lo mismo que el Depurador de JavaScript; tienen diferentes sintaxis AFAIK, por lo que el comando de impresión en JavaScript Debugger no funcionará aquí. En la Consola de JavaScript, print() enviará el parámetro a la impresora.
Además de la respuesta de Delan Azabani , me gusta compartir mi console.js , y uso para el mismo propósito. Creo una consola noop usando una matriz de nombres de funciones, lo que en mi opinión es una forma muy conveniente de hacerlo, y me ocupé de Internet Explorer, que tiene una función console.log , pero no console.debug :
// Create a noop console object if the browser doesn''t provide one...
if (!window.console){
window.console = {};
}
// Internet Explorer has a console that has a ''log'' function, but no ''debug''. To make console.debug work in Internet Explorer,
// We just map the function (extend for info, etc. if needed)
else {
if (!window.console.debug && typeof window.console.log !== ''undefined'') {
window.console.debug = window.console.log;
}
}
// ... and create all functions we expect the console to have (taken from Firebug).
var names = ["log", "debug", "info", "warn", "error", "assert", "dir", "dirxml",
"group", "groupEnd", "time", "timeEnd", "count", "trace", "profile", "profileEnd"];
for (var i = 0; i < names.length; ++i){
if(!window.console[names[i]]){
window.console[names[i]] = function() {};
}
}
Aquí está mi clase envoltura consola. Me da un alcance de salida también para hacer la vida más fácil. Tenga en cuenta el uso de localConsole.debug.call() para que localConsole.debug ejecute en el ámbito de la clase de llamada, proporcionando acceso a su método toString .
localConsole = {
info: function(caller, msg, args) {
if ( window.console && window.console.info ) {
var params = [(this.className) ? this.className : this.toString() + ''.'' + caller + ''(), '' + msg];
if (args) {
params = params.concat(args);
}
console.info.apply(console, params);
}
},
debug: function(caller, msg, args) {
if ( window.console && window.console.debug ) {
var params = [(this.className) ? this.className : this.toString() + ''.'' + caller + ''(), '' + msg];
if (args) {
params = params.concat(args);
}
console.debug.apply(console, params);
}
}
};
someClass = {
toString: function(){
return ''In scope of someClass'';
},
someFunc: function() {
myObj = {
dr: ''zeus'',
cat: ''hat''
};
localConsole.debug.call(this, ''someFunc'', ''myObj: '', myObj);
}
};
someClass.someFunc();
Esto da salida como tal en Firebug :
In scope of someClass.someFunc(), myObj: Object { dr="zeus", more...}
O cromo:
In scope of someClass.someFunc(), obj:
Object
cat: "hat"
dr: "zeus"
__proto__: Object
Aquí hay un breve script que comprueba si la consola está disponible. Si no lo está, intenta cargar Firebug y si Firebug no está disponible, carga Firebug Lite. Ahora puedes usar console.log en cualquier navegador. ¡Disfrutar!
if (!window[''console'']) {
// Enable console
if (window[''loadFirebugConsole'']) {
window.loadFirebugConsole();
}
else {
// No console, use Firebug Lite
var firebugLite = function(F, i, r, e, b, u, g, L, I, T, E) {
if (F.getElementById(b))
return;
E = F[i+''NS'']&&F.documentElement.namespaceURI;
E = E ? F[i + ''NS''](E, ''script'') : F[i](''script'');
E[r](''id'', b);
E[r](''src'', I + g + T);
E[r](b, u);
(F[e](''head'')[0] || F[e](''body'')[0]).appendChild(E);
E = new Image;
E[r](''src'', I + L);
};
firebugLite(
document, ''createElement'', ''setAttribute'', ''getElementsByTagName'',
''FirebugLite'', ''4'', ''firebug-lite.js'',
''releases/lite/latest/skin/xp/sprite.png'',
''https://getfirebug.com/'', ''#startOpened'');
}
}
else {
// Console is already available, no action needed.
}
Ejecutando el siguiente código desde la barra de direcciones del navegador:
javascript: console.log(2);
Imprime correctamente el mensaje en la "Consola de JavaScript" en Google Chrome.
He tenido muchos problemas con los desarrolladores que verificaban en su consola. () Declaraciones. Y, realmente no me gusta depurar Internet Explorer, a pesar de las fantásticas mejoras de Internet Explorer 10 y Visual Studio 2012 , etc.
Por lo tanto, he anulado el objeto de la consola en sí ... He agregado un indicador __localhost que solo permite sentencias de consola cuando está en localhost. También agregué funciones de consola. () A Internet Explorer (que muestra una alerta () en su lugar).
// Console extensions...
(function() {
var __localhost = (document.location.host === "localhost"),
__allow_examine = true;
if (!console) {
console = {};
}
console.__log = console.log;
console.log = function() {
if (__localhost) {
if (typeof console !== "undefined" && typeof console.__log === "function") {
console.__log(arguments);
} else {
var i, msg = "";
for (i = 0; i < arguments.length; ++i) {
msg += arguments[i] + "/r/n";
}
alert(msg);
}
}
};
console.__info = console.info;
console.info = function() {
if (__localhost) {
if (typeof console !== "undefined" && typeof console.__info === "function") {
console.__info(arguments);
} else {
var i, msg = "";
for (i = 0; i < arguments.length; ++i) {
msg += arguments[i] + "/r/n";
}
alert(msg);
}
}
};
console.__warn = console.warn;
console.warn = function() {
if (__localhost) {
if (typeof console !== "undefined" && typeof console.__warn === "function") {
console.__warn(arguments);
} else {
var i, msg = "";
for (i = 0; i < arguments.length; ++i) {
msg += arguments[i] + "/r/n";
}
alert(msg);
}
}
};
console.__error = console.error;
console.error = function() {
if (__localhost) {
if (typeof console !== "undefined" && typeof console.__error === "function") {
console.__error(arguments);
} else {
var i, msg = "";
for (i = 0; i < arguments.length; ++i) {
msg += arguments[i] + "/r/n";
}
alert(msg);
}
}
};
console.__group = console.group;
console.group = function() {
if (__localhost) {
if (typeof console !== "undefined" && typeof console.__group === "function") {
console.__group(arguments);
} else {
var i, msg = "";
for (i = 0; i < arguments.length; ++i) {
msg += arguments[i] + "/r/n";
}
alert("group:/r/n" + msg + "{");
}
}
};
console.__groupEnd = console.groupEnd;
console.groupEnd = function() {
if (__localhost) {
if (typeof console !== "undefined" && typeof console.__groupEnd === "function") {
console.__groupEnd(arguments);
} else {
var i, msg = "";
for (i = 0; i < arguments.length; ++i) {
msg += arguments[i] + "/r/n";
}
alert(msg + "/r/n}");
}
}
};
/// <summary>
/// Clever way to leave hundreds of debug output messages in the code,
/// but not see _everything_ when you only want to see _some_ of the
/// debugging messages.
/// </summary>
/// <remarks>
/// To enable __examine_() statements for sections/groups of code, type the
/// following in your browser''s console:
/// top.__examine_ABC = true;
/// This will enable only the console.examine("ABC", ... ) statements
/// in the code.
/// </remarks>
console.examine = function() {
if (!__allow_examine) {
return;
}
if (arguments.length > 0) {
var obj = top["__examine_" + arguments[0]];
if (obj && obj === true) {
console.log(arguments.splice(0, 1));
}
}
};
})();
Ejemplo de uso:
console.log("hello");
Chrome / Firefox:
prints hello in the console window.
Explorador de Internet:
displays an alert with ''hello''.
Para aquellos que observan detenidamente el código, descubrirán la función console.examine (). Creé esto hace años para poder dejar el código de depuración en ciertas áreas alrededor del producto para ayudar a solucionar problemas de QA / clientes. Por ejemplo, dejaría la siguiente línea en algún código publicado:
function doSomething(arg1) {
// ...
console.examine("someLabel", arg1);
// ...
}
Y luego, desde el producto publicado, escriba lo siguiente en la consola (o barra de direcciones con el prefijo ''javascript:''):
top.__examine_someLabel = true;
Luego, veré todas las declaraciones de console.examine () registradas. Ha sido una ayuda fantástica muchas veces.
Mejorando aún más las ideas de Delan y Andru (por lo que esta respuesta es una versión editada); Es probable que console.log exista mientras que las otras funciones no, por lo que debe tener el mapa predeterminado para la misma función que console.log ...
Puede escribir un script que cree funciones de consola si no existen:
if (!window.console) console = {};
console.log = console.log || function(){};
console.warn = console.warn || console.log; // defaults to log
console.error = console.error || console.log; // defaults to log
console.info = console.info || console.log; // defaults to log
Luego, use cualquiera de los siguientes:
console.log(...);
console.error(...);
console.info(...);
console.warn(...);
Estas funciones registrarán diferentes tipos de elementos (que pueden filtrarse según el registro, información, error o advertencia) y no causarán errores cuando la consola no esté disponible. Estas funciones funcionarán en consolas Firebug y Chrome.
Mejorando la idea de Andru, puede escribir un script que cree funciones de consola si no existen:
if (!window.console) console = {};
console.log = console.log || function(){};
console.warn = console.warn || function(){};
console.error = console.error || function(){};
console.info = console.info || function(){};
Luego, use cualquiera de los siguientes:
console.log(...);
console.error(...);
console.info(...);
console.warn(...);
Estas funciones registrarán diferentes tipos de elementos (que pueden filtrarse según el registro, información, error o advertencia) y no causarán errores cuando la consola no esté disponible. Estas funciones funcionarán en consolas Firebug y Chrome.
O usa esta función:
function log(message){
if (typeof console == "object") {
console.log(message);
}
}
Personalmente uso esto, que es similar a tarek11011:
// Use a less-common namespace than just ''log''
function myLog(msg)
{
// Attempt to send a message to the console
try
{
console.log(msg);
}
// Fail gracefully if it does not exist
catch(e){}
}
El punto principal es que es una buena idea tener al menos alguna práctica de registro que no sea simplemente el uso de console.log() directamente en su código JavaScript, porque si se olvida de ello y está en un sitio de producción, es posible que se rompa. todo el código de JavaScript para esa página.
Podría usar console.log() si tiene un código de depuración en el editor de software de programación que tiene y verá que es probable que sea el mejor editor para mí (Google Chrome). Solo presiona F12 y presiona la pestaña de la consola. Verás el resultado. Feliz codificacion :)
Simulador simple de Internet Explorer 7 e inferior que conserva la numeración de líneas para otros navegadores:
/* Console shim */
(function () {
var f = function () {};
if (!window.console) {
window.console = {
log:f, info:f, warn:f, debug:f, error:f
};
}
}());
Solo agrega una característica interesante que muchos desarrolladores se pierden:
console.log("this is %o, event is %o, host is %s", this, e, location.host);
Este es el contenido mágico %o volcado en el que se puede hacer clic y en un objeto de navegación profunda de un objeto JavaScript. %s se mostró solo para un registro.
También esto es genial también:
console.log("%s", new Error().stack);
Lo que proporciona un seguimiento de pila similar a Java al punto de la new Error() invocación de new Error() (incluida la ruta al archivo y el número de línea ).
¡Tanto la new Error().stack %o como la new Error().stack están disponibles en Chrome y Firefox!
También para trazas de pila en el uso de Firefox:
console.trace();
Como https://developer.mozilla.org/en-US/docs/Web/API/console dice.
¡Feliz piratería!
ACTUALIZACIÓN : algunas bibliotecas están escritas por personas malas que redefinen el objeto de la console para sus propios fines. Para restaurar la console navegador original después de cargar la biblioteca, use:
delete console.log;
delete console.warn;
....
Consulte la pregunta sobre el desbordamiento de pila Restaurando console.log () .
Solo una advertencia rápida: si desea realizar una prueba en Internet Explorer sin eliminar todos los console.log (), deberá usar Firebug Lite o obtendrá algunos errores no especialmente amigables.
(O crea tu propia console.log () que simplemente devuelve falso).
