Chrome中的console.log时间戳？

有没有一种快速的方法可以让Chrome在console.log写入时输出时间戳（就像Firefox一样）。或者是new Date().getTime()唯一的选择？

在Chrome中，有一个名为“显示时间戳”的控制台设置（开发人员工具->控制台->设置[右上角]），正是我所需要的。

我刚刚找到了。不需要其他肮脏的骇客来破坏占位符并删除记录消息的代码中的位置。

Chrome 68+更新

“显示时间戳记”设置已移至“ DevTools设置”的“首选项”窗格，该窗格位于DevTools抽屉的右上角：

试试这个：

console.logCopy = console.log.bind(console);

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

或者，如果您需要时间戳记，请执行以下操作：

console.logCopy = console.log.bind(console);

console.log = function(data)
{
    var timestamp = '[' + Date.now() + '] ';
    this.logCopy(timestamp, data);
};

要登录多件事情 ，并在一个不错的方式（如对象树表示）：

console.logCopy = console.log.bind(console);

console.log = function()
{
    if (arguments.length)
    {
        var timestamp = '[' + Date.now() + '] ';
        this.logCopy(timestamp, arguments);
    }
};

带格式字符串（JSFiddle）

console.logCopy = console.log.bind(console);

console.log = function()
{
    // Timestamp to prepend
    var timestamp = new Date().toJSON();

    if (arguments.length)
    {
        // True array copy so we can call .splice()
        var args = Array.prototype.slice.call(arguments, 0);

        // If there is a format string then... it must
        // be a string
        if (typeof arguments[0] === "string")
        {
            // Prepend timestamp to the (possibly format) string
            args[0] = "%o: " + arguments[0];

            // Insert the timestamp where it has to be
            args.splice(1, 0, timestamp);

            // Log the whole array
            this.logCopy.apply(this, args);
        }
        else
        { 
            // "Normal" log
            this.logCopy(timestamp, args);
        }
    }
};

输出如下：

PS：仅在Chrome中测试。

PPS：Array.prototype.slice在这里不是完美的，因为它将被记录为对象数组，而不是一系列对象。

您可以使用开发工具分析器。

console.time('Timer name');
//do critical time stuff
console.timeEnd('Timer name');

“计时器名称”必须相同。您可以使用多个具有不同名称的计时器实例。

我最初将其添加为评论，但由于至少一个人找不到该选项（或者由于某些原因，该选项在其特定版本中不可用），因此我想添加一个屏幕截图。

在Chrome 68.0.3440.106（现在已在72.0.3626.121中检查）上，我不得不

• 开放开发工具（F12）
• 点击右上角的三点菜单
• 点击设置
• 在左侧菜单中选择偏好设置
• 在设置屏幕的控制台部分检查显示时间戳

我使用转换arguments为Array，Array.prototype.slice这样我就可以添加要添加的concat另一个Array，然后将其传递给console.log.apply(console, /*here*/);

var log = function () {
    return console.log.apply(
        console,
        ['['+new Date().toISOString().slice(11,-5)+']'].concat(
            Array.prototype.slice.call(arguments)
        )
    );
};
log(['foo']); // [18:13:17] ["foo"]

似乎arguments也可以Array.prototype.unshift编辑，但我不知道像这样修改它是否是一个好主意/是否还会有其他副作用

var log = function () {
    Array.prototype.unshift.call(
        arguments,
        '['+new Date().toISOString().slice(11,-5)+']'
    );
    return console.log.apply(console, arguments);
};
log(['foo']); // [18:13:39] ["foo"]

+new Date并且Date.now()是获取时间戳的替代方法

如果您使用的是Google Chrome浏览器，则可以使用Chrome控制台API：

• console.time：在代码中要启动计时器的位置调用它
• console.timeEnd：调用它以停止计时器

这两个呼叫之间的经过时间显示在控制台中。

有关详细信息，请参阅文档链接：https : //developers.google.com/chrome-developer-tools/docs/console

从Chrome 68：

“显示时间戳记”已移至设置

以前在“控制台设置”中的“显示时间戳”复选框控制台设置已移至“设置”。

也尝试一下：

this.log = console.log.bind( console, '[' + new Date().toUTCString() + ']' );

此函数将时间戳记，文件名和行号与内建的相同 console.log。

如果要保留行号信息（每个消息都指向其.log（）调用，而并非所有消息都指向我们的包装器），则必须使用.bind()。您可以通过附加一个额外的timestamp参数，console.log.bind(console, <timestamp>)但问题是您需要每次都重新运行一次以获取具有新时间戳的函数。一个笨拙的方法是返回绑定函数的函数：

function logf() {
  // console.log is native function, has no .bind in some browsers.
  // TODO: fallback to wrapping if .bind doesn't exist...
  return Function.prototype.bind.call(console.log, console, yourTimeFormat());
}

然后必须与两次调用一起使用：

logf()(object, "message...")

但是我们可以通过安装带有getter函数的属性来隐式地进行第一个调用：

var origLog = console.log;
// TODO: fallbacks if no `defineProperty`...
Object.defineProperty(console, "log", {
  get: function () { 
    return Function.prototype.bind.call(origLog, console, yourTimeFormat()); 
  }
});

现在，您只需致电console.log(...)并自动添加时间戳即可！

> console.log(12)
71.919s 12 VM232:2
undefined
> console.log(12)
72.866s 12 VM233:2
undefined

您甚至可以通过简单的方法log()而不是console.log()通过操作来实现这种神奇的行为Object.defineProperty(window, "log", ...)。

请参阅https://github.com/pimterry/loglevel，以获取使用完善的安全控制台包装程序.bind()，并具有兼容性后备功能。

请参阅https://github.com/eligrey/Xccessors以了解从defineProperty()旧版__defineGetter__API的兼容性回退。如果这两个属性API都不起作用，则应该回退到每次都会获得新时间戳的包装函数。（在这种情况下，您会丢失行号信息，但时间戳仍会显示。）

样板：时间格式化我喜欢的方式：

var timestampMs = ((window.performance && window.performance.now) ?
                 function() { return window.performance.now(); } :
                 function() { return new Date().getTime(); });
function formatDuration(ms) { return (ms / 1000).toFixed(3) + "s"; }
var t0 = timestampMs();
function yourTimeFormat() { return formatDuration(timestampMs() - t0); }

这会使用所需的任意this多个参数向本地范围（使用）添加一个“ log”函数：

this.log = function() {
    var args = [];
    args.push('[' + new Date().toUTCString() + '] ');
    //now add all the other arguments that were passed in:
    for (var _i = 0, _len = arguments.length; _i < _len; _i++) {
      arg = arguments[_i];
      args.push(arg);
    }

    //pass it all into the "real" log function
    window.console.log.apply(window.console, args); 
}

因此，您可以使用它：

this.log({test: 'log'}, 'monkey', 42);

输出如下所示：

[2013年3月11日星期一，格林尼治标准时间（GMT）]对象{test：“ log”}猴子42

从JSmyth扩展了很好的解决方案“带有格式字符串”，也支持

• 所有其它console.log变化（log，debug，info，warn，error）
• 包括时间戳字符串灵活性参数（例如09:05:11.518vs.2018-06-13T09:05:11.518Z）
• 包括回退，以防console浏览器不存在其功能

。

var Utl = {

consoleFallback : function() {

    if (console == undefined) {
        console = {
            log : function() {},
            debug : function() {},
            info : function() {},
            warn : function() {},
            error : function() {}
        };
    }
    if (console.debug == undefined) { // IE workaround
        console.debug = function() {
            console.info( 'DEBUG: ', arguments );
        }
    }
},


/** based on timestamp logging: from: https://stackoverflow.com/a/13278323/1915920 */
consoleWithTimestamps : function( getDateFunc = function(){ return new Date().toJSON() } ) {

    console.logCopy = console.log.bind(console)
    console.log = function() {
        var timestamp = getDateFunc()
        if (arguments.length) {
            var args = Array.prototype.slice.call(arguments, 0)
            if (typeof arguments[0] === "string") {
                args[0] = "%o: " + arguments[0]
                args.splice(1, 0, timestamp)
                this.logCopy.apply(this, args)
            } else this.logCopy(timestamp, args)
        }
    }
    console.debugCopy = console.debug.bind(console)
    console.debug = function() {
        var timestamp = getDateFunc()
        if (arguments.length) {
            var args = Array.prototype.slice.call(arguments, 0)
            if (typeof arguments[0] === "string") {
                args[0] = "%o: " + arguments[0]
                args.splice(1, 0, timestamp)
                this.debugCopy.apply(this, args)
            } else this.debugCopy(timestamp, args)
        }
    }
    console.infoCopy = console.info.bind(console)
    console.info = function() {
        var timestamp = getDateFunc()
        if (arguments.length) {
            var args = Array.prototype.slice.call(arguments, 0)
            if (typeof arguments[0] === "string") {
                args[0] = "%o: " + arguments[0]
                args.splice(1, 0, timestamp)
                this.infoCopy.apply(this, args)
            } else this.infoCopy(timestamp, args)
        }
    }
    console.warnCopy = console.warn.bind(console)
    console.warn = function() {
        var timestamp = getDateFunc()
        if (arguments.length) {
            var args = Array.prototype.slice.call(arguments, 0)
            if (typeof arguments[0] === "string") {
                args[0] = "%o: " + arguments[0]
                args.splice(1, 0, timestamp)
                this.warnCopy.apply(this, args)
            } else this.warnCopy(timestamp, args)
        }
    }
    console.errorCopy = console.error.bind(console)
    console.error = function() {
        var timestamp = getDateFunc()
        if (arguments.length) {
            var args = Array.prototype.slice.call(arguments, 0)
            if (typeof arguments[0] === "string") {
                args[0] = "%o: " + arguments[0]
                args.splice(1, 0, timestamp)
                this.errorCopy.apply(this, args)
            } else this.errorCopy(timestamp, args)
        }
    }
}
}  // Utl

Utl.consoleFallback()
//Utl.consoleWithTimestamps()  // defaults to e.g. '2018-06-13T09:05:11.518Z'
Utl.consoleWithTimestamps( function(){ return new Date().toJSON().replace( /^.+T(.+)Z.*$/, '$1' ) } )  // e.g. '09:05:11.518'

我在大多数Node.JS应用程序中都有此功能。它也可以在浏览器中使用。

function log() {
  const now = new Date();
  const currentDate = `[${now.toISOString()}]: `;
  const args = Array.from(arguments);
  args.unshift(currentDate);
  console.log.apply(console, args);
}

ES6解决方案：

const timestamp = () => `[${new Date().toUTCString()}]`
const log = (...args) => console.log(timestamp(), ...args)

其中，timestamp()收益其实格式化的时间戳和log添加时间戳和传播自己的所有参数console.log

JSmyth对答案的改进：

console.logCopy = console.log.bind(console);

console.log = function()
{
    if (arguments.length)
    {
        var timestamp = new Date().toJSON(); // The easiest way I found to get milliseconds in the timestamp
        var args = arguments;
        args[0] = timestamp + ' > ' + arguments[0];
        this.logCopy.apply(this, args);
    }
};

这个：

• 显示时间戳（以毫秒为单位）
• 假设格式字符串是第一个参数 .log