Básicamente, tienes que condicionar la definición de console.test
al valor de window.test
window.test = true // o false
if(window.test === true) {
console.test = function() { /* hace algo */ };
} else {
console.test=function() { /* no hace nada */ };
}
Lo más simple, sería hacer:
window.test = true // o false
if(window.test === true) {
console.test = console.log;
} else {
console.test=function() { /* no hace nada */ };
}
Pero para definir console.test
hay muchas maneras y vamos a explorarlas para que la respuesta sea lo más completa posible:
Llamando la función "a lo bruto"
console.test = function() {
var args = [].slice.call(arguments);
console.log(args);
};
Pero esto imprimirá los argumentos dentro de un array:
console.test('hola','amigo')
// imprime ["hola", "amigo"]
Usando spread operator
En navegadores modernos, el spread operator
se encarga de pasar el array de argumentos como parámetros
console.test = function() { console.log(...arguments); };
console.test('hola',{a:1}, 'amigo')
// imprime hola, ▸{a:1}, amigo
Usando console.log.apply
Puedes hacer algo como:
window.test = true // o false
if (window.test === true) {
console.test = function() { console.log.apply(console,arguments) };
} else {
console.test = function() { /* no hace nada */ };
}
Al usar Function.prototype.apply
puedes llamar a una función con su respectivo contexto (en este caso console
) y pasarle N argumentos en forma de array:
console.log.apply(console,['a','b','c']);
Que a su vez invocarán a la función con ese array en forma de una lista de argumentos, lo cual equivale a hacer:
console.log('a','b','c');
PEEEERO todos estos enfoques harán que en el inspector de tu consola todos los console.test
aparezcan siendo llamados desde el script donde definiste la función, cuando sería más útil que aparecieran llamados desde el script (y la línea) donde lo hayas invocado.
Usando Function.prototype.bind
Para que los llamados a console.test
aparezcan invocados desde el script y la línea correcta, lo que se hace es:
window.test = true // o false
if (window.test === true) {
console.test = console.log.bind(console);
} else {
console.test = function() { /* no hace nada */ };
}
Al usar Function.prototype.bind
estás en el fondo haciendo un duplicado de la función, que sería equivalente a hacer console.test = console.log
y aparecerá siendo llamado desde el script que lo invoca. Pero además, la gracia del bind, es que puedes pasarle parámetros adicionales que se anteponen a los argumentos:
console.test = console.log.bind(console,'TEST:');
En cuyo caso console.test('hola',{x:1},'amigo');
imprimirá
TEST: hola ▸{a: 1} amigo
Puedes ir más allá y hacer que TEST
se imprima con un color:
console.test = console.log.bind(console, '%cTEST:', 'color:#090;font-weight:bold;');
En cuyo caso TEST:
tendrá un color distinto. Abre el panel devtools usando F12 y corre este script:
console.test = console.log.bind(console, '%cTEST:', 'color:#090;font-weight:bold;');
console.test('hola',{a:1},'chao');
(va a alegar que el snippet está "sandboxed" pero igual aparecerá TEST en verde)
Usando getters
(este es mi preferido)
Podrías definir un método en el objeto console
con parámetros dinámicos. Por ejemplo, que imprimiera el tiempo que ha pasado desde que declaraste console.test
hasta que lo invocas. De nuevo, abre tu panel con F12 y ejecuta:
window.test = true;
window.timeStart = Date.now();
Object.defineProperty(console, "test", {
get: function() {
if (window.test !== true) {
return function() { /* no hace nada */ };
}
return Function.prototype.bind.call(
console.log,
console,
'%c' + parseInt((Date.now() - window.timeStart) / 100, 10) / 10 + 's TEST:',
"color:#03C;font-weight:bold;"
);
}
});
window.setTimeout(function() {
console.test('Me imprimo a los 2 segundos');
}, 2000);
window.setTimeout(function() {
console.test('Me imprimo a los 3.5 segundos');
}, 3500);
La consola dirá:
2s TEST: Me imprimo a los 2 segundos
3.5s TEST: Me imprimo a los 3.5 segundos
Y eso es algo que no podrías hacer con console.log.bind
directamente.
Ve un ejemplo corriendo en Plunkr (primero abre la consola con F12 para ver los mensajes)