[javascript] 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)
  • 오른쪽 상단의 3 점 메뉴를 클릭하십시오
  • 클릭 설정
  • 왼쪽 메뉴에서 기본 설정을 선택하십시오
  • 설정 화면의 콘솔 섹션에서 타임 스탬프 표시를 확인하십시오.

설정> 환경 설정> 콘솔> 타임 스탬프 표시


답변

I 변환 arguments배열 하여 Array.prototype.slice나는 할 수 있도록 concat서로 배열 그때 추가, 그것을로 전달하려면 무엇 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 DateDate.now()타임 스탬프를 얻을 수있는 다른 방법이 있습니다


답변

Chrome 브라우저를 사용하는 경우 크롬 콘솔 API를 사용할 수 있습니다.

  • console.time : 타이머를 시작하려는 코드의 지점에서 호출하십시오.
  • console.timeEnd : 타이머를 중지하려면 호출하십시오.

이 두 통화 사이의 경과 시간이 콘솔에 표시됩니다.

자세한 내용은 다음 문서 링크를 참조하십시오. https://developers.google.com/chrome-developer-tools/docs/console