13

I have the following code:

var myLog = console.log.bind(console, '[DEBUG]');

Which works find when I want to log things prepended with [DEBUG] to the console. Now I want to add a date/time to the log and I tried this:

var myLog = console.log.bind(console, '[DEBUG ' + (new Date) + ']');

Which obviously does not work because it always logs the same time (the time that the .bind was called).

Is there any way (using .bind) to log the current time on each log without having to do this:

var myLog = function(){ var args = ['[DEBUG ' + (new Date) + ']']; for(var i = 0; i < arguments.length; ++i) { args.push(arguments[i]); } return console.log.apply(console, args); };

?

Because the above method shows me the line that console.log.apply was called and not the line that myLog was called.

Improve this question
2
  • You could extract the line where it was called from Error().stack Commented Aug 23, 2013 at 19:28
  • @copy that is what I was already doing... But that does not allow for you to click on it in the console to get to the line in the source file Commented Aug 26, 2013 at 16:33

2 Answers 2

Reset to default
38
+400

Yes. http://jsfiddle.net/SwFJg/6/

var DEBUG = (function(){ var timestamp = function(){}; timestamp.toString = function(){ return "[DEBUG " + (new Date).toLocaleTimeString() + "]"; }; return { log: console.log.bind(console, '%s', timestamp) } })(); DEBUG.log("banana", {foo:'bar'}); //[DEBUG 2:43:21 PM] banana Object {foo: "bar"} console.log("Peppercorn"); //Peppercorn DEBUG.log("apple"); //[DEBUG 2:43:21 PM] apple DEBUG.log("orange"); //[DEBUG 2:43:21 PM] orange setTimeout(function(){ DEBUG.log("mango"); //[DEBUG 2:43:25 PM] mango },3000)

This works because toString is called on timestamp (and, in fact, everything) each time console.log is called.

We overwrite the default toString method, and replace it with a time stamp (obviously you can change the output to whatever you want).

I chose the above pattern because, as others have noted (in SO chat), you can easily extend the DEBUG object to do other things.

... return { log: console.log.bind(console, '%s', timestamp), error: console.error.bind(console, '%s', timestamp), info: console.info.bind(console, '%s', timestamp), warn: console.warn.bind(console, '%s', timestamp), group: ..., groupEnd: ..., groupCollapsed: ... // etc } ...
Improve this answer
Sign up to request clarification or add additional context in comments.

5 Comments

I think you could simplify the code if you just pass an object with a toString method directly to the function: console.log.bind(console, {toString: function() {...}}). No need to create DEBUG or empty functions. Good idea though!
I see, makes sense. At least in Firefox you can enforce the evaluation as a string: jsfiddle.net/fkling/SwFJg/4. Although this is also supported in Chrome, it just shows Object. Note that your solution doesn't seem to work in Firefox for me, but if you enforce string evaluation, it does: jsfiddle.net/fkling/SwFJg/5.
@FelixKling weird. To be honest, the question isn't completely relevant to FF since it already includes timestamps. It is a little concerning that it prevents anything from being logged though. Is there a way to remove the enforced string evaluation?
is there a way to bind more than one function ? what I mean is if I want to log something other than timestamp that would take a variable beside the time stamp not on other line
let originalLog = console.log; console.log = (...args)=>{ originalLog(dayjs().format("[[]DD/MM/YYYY HH:mm:ss]"),...args); } Just copy paste this (it's using dayjs for the format).
2

I think this is what you are looking for, which is simple

console.logCopy = console.debug.bind(console); console.debug = function(data) { var currentDate = '[' + new Date().toUTCString() + '] '; this.logCopy(currentDate, data); };
Improve this answer

3 Comments

This only logs if you pass only one thing to console log. If you pass multiple things they get lost
If you want to support multiple parameters, you can use my solution here:
stackoverflow.com/questions/18814221/…

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.