ホームページ > 記事 > ウェブフロントエンド > JavaScript の console.log をカスタマイズする
デフォルトの console.log() を拡張して、現在の日時を接頭辞として付ける方法を疑問に思ったことがあるなら:
// Store the default log method: const _log = console.log; // Override: console.log = (...args) => { const prefix = `[${new Date().toLocaleString()}]`; if (typeof args[0] === "string") args[0] = `${prefix} ${args[0]}` else args.unshift(prefix); _log(...args); }; // Examples: console.log("Test"); // [Date Time] Test console.log({a: "b"}); // [Date Time] {a: "b"} console.log("Hello, %s!", "World"); // [Date Time] Hello, World! console.log("Number: %i", 42); // [Date Time] Number: 42 console.log("%cStylized text", 'color: red'); // [Date Time] Stylized text
console.log を書くのは面倒なので、デフォルトの動作をオーバーライドする代わりに、console.log を内部的に使用する log() 関数を作成しましょう。
const log = (...args) => { const prefix = `[${new Date().toLocaleString()}]`; if (typeof args[0] === "string") args[0] = `${prefix} ${args[0]}` else args.unshift(prefix); console.log(...args); }; // Examples: log("Test"); // [Date Time] Test log({a: "b"}); // [Date Time] {a: "b"} log("Hello, %s!", "World"); // [Date Time] Hello, World! log("Number: %i", 42); // [Date Time] Number: 42 log("%cStylized text", 'color: red'); // [Date Time] Stylized text
ロギングを楽しんでください。ブレークポイントを忘れないでください ;)
以上がJavaScript の console.log をカスタマイズするの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。