Pembungkus yang tepat untuk console.log dengan nomor baris yang benar?

Saya sekarang sedang mengembangkan aplikasi, dan melakukan isDebugperalihan global . Saya ingin membungkus console.loguntuk penggunaan yang lebih nyaman.

//isDebug controls the entire site.
var isDebug = true;

//debug.js
function debug(msg, level){
    var Global = this;
    if(!(Global.isDebug && Global.console && Global.console.log)){
        return;
    }
    level = level||'info';
    Global.console.log(level + ': '+ msg);
}

//main.js
debug('Here is a msg.');

Lalu saya mendapatkan hasil ini di konsol Firefox.

info: Here is a msg.                       debug.js (line 8)

Bagaimana jika saya ingin login dengan nomor baris di mana debug()dipanggil, seperti info: Here is a msg. main.js (line 2)?

Ini adalah pertanyaan lama dan Semua jawaban yang diberikan terlalu hackey, memiliki masalah lintas browser UTAMA, dan tidak memberikan sesuatu yang super berguna. Solusi ini berfungsi di setiap browser dan melaporkan semua data konsol persis seperti yang seharusnya. Tidak diperlukan peretasan dan satu baris kode. Lihat codepen .

var debug = console.log.bind(window.console)

Buat sakelar seperti ini:

isDebug = true // toggle this to turn on / off for global controll

if (isDebug) var debug = console.log.bind(window.console)
else var debug = function(){}

Maka cukup hubungi sebagai berikut:

debug('This is happening.')

Anda bahkan dapat mengambil alih console.log dengan sakelar seperti ini:

if (!isDebug) console.log = function(){}

Jika Anda ingin melakukan sesuatu yang bermanfaat dengan itu .. Anda dapat menambahkan semua metode konsol dan membungkusnya dalam fungsi yang dapat digunakan kembali yang tidak hanya memberikan kontrol global, tetapi juga tingkat kelas:

var Debugger = function(gState, klass) {

  this.debug = {}

  if (gState && klass.isDebug) {
    for (var m in console)
      if (typeof console[m] == 'function')
        this.debug[m] = console[m].bind(window.console, klass.toString()+": ")
  }else{
    for (var m in console)
      if (typeof console[m] == 'function')
        this.debug[m] = function(){}
  }
  return this.debug
}

isDebug = true //global debug state

debug = Debugger(isDebug, this)

debug.log('Hello log!')
debug.trace('Hello trace!')

Sekarang Anda dapat menambahkannya ke kelas Anda:

var MyClass = function() {
  this.isDebug = true //local state
  this.debug = Debugger(isDebug, this)
  this.debug.warn('It works in classses')
}

Saya menyukai jawaban @ fredrik , jadi saya menggulungnya dengan jawaban lain yang membagi stacktrace Webkit , dan menggabungkannya dengan pembungkus aman console.log @ PaulIrish . "Membakukan" filename:lineke "objek khusus" sehingga menonjol dan sebagian besar terlihat sama di FF dan Chrome.

Pengujian di biola: http://jsfiddle.net/drzaus/pWe6W/

_log = (function (undefined) {
    var Log = Error; // does this do anything?  proper inheritance...?
    Log.prototype.write = function (args) {
        /// <summary>
        /// Paulirish-like console.log wrapper.  Includes stack trace via @fredrik SO suggestion (see remarks for sources).
        /// </summary>
        /// <param name="args" type="Array">list of details to log, as provided by `arguments`</param>
        /// <remarks>Includes line numbers by calling Error object -- see
        /// * http://paulirish.com/2009/log-a-lightweight-wrapper-for-consolelog/
        /// * /programming/13815640/a-proper-wrapper-for-console-log-with-correct-line-number
        /// * https://stackoverflow.com/a/3806596/1037948
        /// </remarks>

        // via @fredrik SO trace suggestion; wrapping in special construct so it stands out
        var suffix = {
            "@": (this.lineNumber
                    ? this.fileName + ':' + this.lineNumber + ":1" // add arbitrary column value for chrome linking
                    : extractLineNumberFromStack(this.stack)
            )
        };

        args = args.concat([suffix]);
        // via @paulirish console wrapper
        if (console && console.log) {
            if (console.log.apply) { console.log.apply(console, args); } else { console.log(args); } // nicer display in some browsers
        }
    };
    var extractLineNumberFromStack = function (stack) {
        /// <summary>
        /// Get the line/filename detail from a Webkit stack trace.  See https://stackoverflow.com/a/3806596/1037948
        /// </summary>
        /// <param name="stack" type="String">the stack string</param>

        if(!stack) return '?'; // fix undefined issue reported by @sigod

        // correct line number according to how Log().write implemented
        var line = stack.split('\n')[2];
        // fix for various display text
        line = (line.indexOf(' (') >= 0
            ? line.split(' (')[1].substring(0, line.length - 1)
            : line.split('at ')[1]
            );
        return line;
    };

    return function (params) {
        /// <summary>
        /// Paulirish-like console.log wrapper
        /// </summary>
        /// <param name="params" type="[...]">list your logging parameters</param>

        // only if explicitly true somewhere
        if (typeof DEBUGMODE === typeof undefined || !DEBUGMODE) return;

        // call handler extension which provides stack trace
        Log().write(Array.prototype.slice.call(arguments, 0)); // turn into proper array
    };//--  fn  returned

})();//--- _log

Ini juga berfungsi dalam simpul, dan Anda bisa mengujinya dengan:

// no debug mode
_log('this should not appear');

// turn it on
DEBUGMODE = true;

_log('you should', 'see this', {a:1, b:2, c:3});
console.log('--- regular log ---');
_log('you should', 'also see this', {a:4, b:8, c:16});

// turn it off
DEBUGMODE = false;

_log('disabled, should not appear');
console.log('--- regular log2 ---');

Anda dapat mempertahankan nomor baris dan mengeluarkan tingkat log dengan beberapa penggunaan cerdas Function.prototype.bind:

function setDebug(isDebug) {
  if (window.isDebug) {
    window.debug = window.console.log.bind(window.console, '%s: %s');
  } else {
    window.debug = function() {};
  }
}

setDebug(true);

// ...

debug('level', 'This is my message.'); // --> level: This is my message. (line X)

Mengambil langkah lebih jauh, Anda dapat memanfaatkan perbedaan consoleerror / peringatan / info dan masih memiliki tingkat kustom. Cobalah!

function setDebug(isDebug) {
  if (isDebug) {
    window.debug = {
      log: window.console.log.bind(window.console, '%s: %s'),
      error: window.console.error.bind(window.console, 'error: %s'),
      info: window.console.info.bind(window.console, 'info: %s'),
      warn: window.console.warn.bind(window.console, 'warn: %s')
    };
  } else {
    var __no_op = function() {};

    window.debug = {
      log: __no_op,
      error: __no_op,
      warn: __no_op,
      info: __no_op
    }
  }
}

setDebug(true);

// ...

debug.log('wat', 'Yay custom levels.'); // -> wat: Yay custom levels.    (line X)
debug.info('This is info.');            // -> info: This is info.        (line Y)
debug.error('Bad stuff happened.');     // -> error: Bad stuff happened. (line Z)

Dari: Bagaimana cara mendapatkan nomor saluran fungsi pemanggil JavaScript? Bagaimana cara mendapatkan URL sumber pemanggil JavaScript? yang Errorobjek memiliki properti nomor baris (di FF). Jadi sesuatu seperti ini seharusnya bekerja:

var err = new Error();
Global.console.log(level + ': '+ msg + 'file: ' + err.fileName + ' line:' + err.lineNumber);

Di browser Webkit Anda memiliki err.stackstring yang mewakili tumpukan panggilan saat ini. Ini akan menampilkan nomor baris saat ini dan informasi lainnya.

MEMPERBARUI

Untuk mendapatkan linenumber yang benar, Anda harus mengaktifkan kesalahan pada baris itu. Sesuatu seperti:

var Log = Error;
Log.prototype.write = function () {
    var args = Array.prototype.slice.call(arguments, 0),
        suffix = this.lineNumber ? 'line: '  + this.lineNumber : 'stack: ' + this.stack;

    console.log.apply(console, args.concat([suffix]));
};

var a = Log().write('monkey' + 1, 'test: ' + 2);

var b = Log().write('hello' + 3, 'test: ' + 4);

Cara untuk menyimpan nomor saluran ada di sini: https://gist.github.com/bgrins/5108712 . Ini kurang lebih bermuara pada ini:

if (Function.prototype.bind) {
    window.log = Function.prototype.bind.call(console.log, console);
}
else {
    window.log = function() { 
        Function.prototype.apply.call(console.log, console, arguments);
    };
}

Anda dapat membungkus ini dengan isDebugdan mengatur window.logke function() { }jika Anda tidak men-debug.

Anda dapat meneruskan nomor baris ke metode debug Anda, seperti ini:

//main.js
debug('Here is a msg.', (new Error).lineNumber);

Di sini, (new Error).lineNumberakan memberi Anda nomor baris saat ini dalam javascriptkode Anda .

Chrome Devtools memungkinkan Anda mencapai ini dengan Blackboxing . Anda dapat membuat pembungkus konsol.log yang dapat memiliki efek samping, memanggil fungsi lain, dll, dan masih mempertahankan nomor baris yang disebut fungsi pembungkus.

Cukup masukkan pembungkus console.log kecil ke dalam file terpisah, mis

(function() {
    var consolelog = console.log
    console.log = function() {
        // you may do something with side effects here.
        // log to a remote server, whatever you want. here
        // for example we append the log message to the DOM
        var p = document.createElement('p')
        var args = Array.prototype.slice.apply(arguments)
        p.innerText = JSON.stringify(args)
        document.body.appendChild(p)

        // call the original console.log function
        consolelog.apply(console,arguments)
    }
})()

Beri nama itu seperti log-blackbox.js

Lalu pergi ke pengaturan Chrome Devtools dan temukan bagian "Blackboxing", tambahkan pola untuk nama file yang ingin Anda blackbox, dalam hal ini log-blackbox.js

Saya menemukan solusi sederhana untuk menggabungkan jawaban yang diterima (mengikat ke console.log / error / etc) dengan beberapa logika luar untuk menyaring apa yang sebenarnya dicatat.

// or window.log = {...}
var log = {
  ASSERT: 1, ERROR: 2, WARN: 3, INFO: 4, DEBUG: 5, VERBOSE: 6,
  set level(level) {
    if (level >= this.ASSERT) this.a = console.assert.bind(window.console);
    else this.a = function() {};
    if (level >= this.ERROR) this.e = console.error.bind(window.console);
    else this.e = function() {};
    if (level >= this.WARN) this.w = console.warn.bind(window.console);
    else this.w = function() {};
    if (level >= this.INFO) this.i = console.info.bind(window.console);
    else this.i = function() {};
    if (level >= this.DEBUG) this.d = console.debug.bind(window.console);
    else this.d = function() {};
    if (level >= this.VERBOSE) this.v = console.log.bind(window.console);
    else this.v = function() {};
    this.loggingLevel = level;
  },
  get level() { return this.loggingLevel; }
};
log.level = log.DEBUG;

Pemakaian:

log.e('Error doing the thing!', e); // console.error
log.w('Bonus feature failed to load.'); // console.warn
log.i('Signed in.'); // console.info
log.d('Is this working as expected?'); // console.debug
log.v('Old debug messages, output dominating messages'); // console.log; ignored because `log.level` is set to `DEBUG`
log.a(someVar == 2) // console.assert

• Catatan yang console.assertmenggunakan logging bersyarat.
• Pastikan alat dev browser Anda menunjukkan semua level pesan!

Jika Anda hanya ingin mengontrol apakah debug digunakan dan memiliki nomor baris yang benar, Anda dapat melakukan ini sebagai gantinya:

if(isDebug && window.console && console.log && console.warn && console.error){
    window.debug = {
        'log': window.console.log,
        'warn': window.console.warn,
        'error': window.console.error
    };
}else{
    window.debug = {
        'log': function(){},
        'warn': function(){},
        'error': function(){}
    };
}

Ketika Anda membutuhkan akses untuk debug, Anda dapat melakukan ini:

debug.log("log");
debug.warn("warn");
debug.error("error");

Jika isDebug == true, Nomor baris dan nama file yang ditampilkan di konsol akan benar, karena debug.logdll sebenarnya adalah alias dari console.logdll.

Jika isDebug == false, tidak ada pesan debug yang ditampilkan, karena debug.logdll tidak melakukan apa-apa (fungsi kosong).

Seperti yang sudah Anda ketahui, fungsi wrapper akan mengacaukan nomor baris dan nama file, jadi sebaiknya Anda tidak menggunakan fungsi wrapper.

Solusi penelusuran tumpukan menampilkan nomor baris tetapi tidak mengizinkan klik untuk pergi ke sumber, yang merupakan masalah besar. Satu-satunya solusi untuk menjaga perilaku ini adalah dengan mengikat ke fungsi aslinya.

Binding mencegah untuk memasukkan logika perantara, karena logika ini akan mengacaukan dengan nomor baris. Namun, dengan mendefinisikan kembali fungsi terikat dan bermain dengan substitusi string konsol , beberapa perilaku tambahan masih dimungkinkan.

Intisari ini menunjukkan kerangka kerja logging minimalis yang menawarkan modul, level log, pemformatan, dan nomor baris yang dapat diklik dalam 34 baris. Gunakan itu sebagai dasar atau inspirasi untuk kebutuhan Anda sendiri.

var log = Logger.get("module").level(Logger.WARN);
log.error("An error has occured", errorObject);
log("Always show this.");

EDIT: intinya termasuk di bawah ini

/*
 * Copyright 2016, Matthieu Dumas
 * This work is licensed under the Creative Commons Attribution 4.0 International License.
 * To view a copy of this license, visit http://creativecommons.org/licenses/by/4.0/
 */

/* Usage : 
 * var log = Logger.get("myModule") // .level(Logger.ALL) implicit
 * log.info("always a string as first argument", then, other, stuff)
 * log.level(Logger.WARN) // or ALL, DEBUG, INFO, WARN, ERROR, OFF
 * log.debug("does not show")
 * log("but this does because direct call on logger is not filtered by level")
 */
var Logger = (function() {
    var levels = {
        ALL:100,
        DEBUG:100,
        INFO:200,
        WARN:300,
        ERROR:400,
        OFF:500
    };
    var loggerCache = {};
    var cons = window.console;
    var noop = function() {};
    var level = function(level) {
        this.error = level<=levels.ERROR ? cons.error.bind(cons, "["+this.id+"] - ERROR - %s") : noop;
        this.warn = level<=levels.WARN ? cons.warn.bind(cons, "["+this.id+"] - WARN - %s") : noop;
        this.info = level<=levels.INFO ? cons.info.bind(cons, "["+this.id+"] - INFO - %s") : noop;
        this.debug = level<=levels.DEBUG ? cons.log.bind(cons, "["+this.id+"] - DEBUG - %s") : noop;
        this.log = cons.log.bind(cons, "["+this.id+"] %s");
        return this;
    };
    levels.get = function(id) {
        var res = loggerCache[id];
        if (!res) {
            var ctx = {id:id,level:level}; // create a context
            ctx.level(Logger.ALL); // apply level
            res = ctx.log; // extract the log function, copy context to it and returns it
            for (var prop in ctx)
                res[prop] = ctx[prop];
            loggerCache[id] = res;
        }
        return res;
    };
    return levels; // return levels augmented with "get"
})();

Ide dengan bind Function.prototype.bindsangat brilian. Anda juga dapat menggunakan npm library -logger . Ini menunjukkan file sumber asal:

Buat siapa saja yang pernah logger di proyek Anda:

var LoggerFactory = require('lines-logger').LoggerFactory;
var loggerFactory = new LoggerFactory();
var logger = loggerFactory.getLoggerColor('global', '#753e01');

Mencetak log:

logger.log('Hello world!')();

Berikut adalah cara untuk menjaga consolepernyataan logging yang ada saat menambahkan nama file dan nomor baris atau info jejak tumpukan lainnya ke output:

(function () {
  'use strict';
  var isOpera = !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;
  var isChrome = !!window.chrome && !!window.chrome.webstore;
  var isIE = /*@cc_on!@*/false || !!document.documentMode;
  var isEdge = !isIE && !!window.StyleMedia;
  var isPhantom = (/PhantomJS/).test(navigator.userAgent);
  Object.defineProperties(console, ['log', 'info', 'warn', 'error'].reduce(function (props, method) {
    var _consoleMethod = console[method].bind(console);
    props[method] = {
      value: function MyError () {
        var stackPos = isOpera || isChrome ? 2 : 1;
        var err = new Error();
        if (isIE || isEdge || isPhantom) { // Untested in Edge
          try { // Stack not yet defined until thrown per https://docs.microsoft.com/en-us/scripting/javascript/reference/stack-property-error-javascript
            throw err;
          } catch (e) {
            err = e;
          }
          stackPos = isPhantom ? 1 : 2;
        }

        var a = arguments;
        if (err.stack) {
          var st = err.stack.split('\n')[stackPos]; // We could utilize the whole stack after the 0th index
          var argEnd = a.length - 1;
          [].slice.call(a).reverse().some(function(arg, i) {
            var pos = argEnd - i;
            if (typeof a[pos] !== 'string') {
              return false;
            }
            if (typeof a[0] === 'string' && a[0].indexOf('%') > -1) { pos = 0 } // If formatting
            a[pos] += ' \u00a0 (' + st.slice(0, st.lastIndexOf(':')) // Strip out character count
              .slice(st.lastIndexOf('/') + 1) + ')'; // Leave only path and line (which also avoids ":" changing Safari console formatting)
            return true;
          });
        }
        return _consoleMethod.apply(null, a);
      }
    };
    return props;
  }, {}));
}());

Kemudian gunakan seperti ini:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8" />
  <script src="console-log.js"></script>
</head>
<body>
  <script>
  function a () {
    console.log('xyz'); // xyz   (console-log.html:10)
  }
  console.info('abc'); // abc   (console-log.html:12)
  console.log('%cdef', "color:red;"); // (IN RED:) // def   (console-log.html:13)
  a();
  console.warn('uuu'); // uuu   (console-log.html:15)
  console.error('yyy'); // yyy   (console-log.html:16)
  </script>
</body>
</html>

Ini berfungsi di Firefox, Opera, Safari, Chrome, dan IE 10 (belum diuji pada IE11 atau Edge).

//isDebug controls the entire site.
var isDebug = true;

//debug.js
function debug(msg, level){
    var Global = this;
    if(!(Global.isDebug && Global.console && Global.console.log)){
        return;
    }
    level = level||'info';
    return 'console.log(\'' + level + ': '+ JSON.stringify(msg) + '\')';
}

//main.js
eval(debug('Here is a msg.'));

Ini akan memberiku info: "Here is a msg." main.js(line:2).

Tapi ekstra evaldibutuhkan, sayang.

Kode dari http://www.briangrinstead.com/blog/console-log-helper-function :

// Full version of `log` that:
//  * Prevents errors on console methods when no console present.
//  * Exposes a global 'log' function that preserves line numbering and formatting.
(function () {
  var method;
  var noop = function () { };
  var methods = [
      'assert', 'clear', 'count', 'debug', 'dir', 'dirxml', 'error',
      'exception', 'group', 'groupCollapsed', 'groupEnd', 'info', 'log',
      'markTimeline', 'profile', 'profileEnd', 'table', 'time', 'timeEnd',
      'timeStamp', 'trace', 'warn'
  ];
  var length = methods.length;
  var console = (window.console = window.console || {});

  while (length--) {
    method = methods[length];

    // Only stub undefined methods.
    if (!console[method]) {
        console[method] = noop;
    }
  }


  if (Function.prototype.bind) {
    window.log = Function.prototype.bind.call(console.log, console);
  }
  else {
    window.log = function() { 
      Function.prototype.apply.call(console.log, console, arguments);
    };
  }
})();

var a = {b:1};
var d = "test";
log(a, d);

Saya telah melihat masalah ini sendiri belakangan ini. Membutuhkan sesuatu yang sangat lurus ke depan untuk mengendalikan penebangan, tetapi juga untuk mempertahankan nomor baris. Solusi saya tidak terlihat elegan dalam kode, tetapi memberikan apa yang dibutuhkan untuk saya. Jika seseorang cukup hati-hati dengan penutupan dan penahan.

Saya telah menambahkan pembungkus kecil ke awal aplikasi:

window.log = {
    log_level: 5,
    d: function (level, cb) {
        if (level < this.log_level) {
            cb();
        }
    }
};

Sehingga nanti saya bisa langsung melakukan:

log.d(3, function(){console.log("file loaded: utils.js");});

Saya sudah mengujinya dari firefox dan crome, dan kedua browser tampaknya menunjukkan log konsol sebagaimana dimaksud. Jika Anda mengisi seperti itu, Anda selalu dapat memperluas metode 'd' dan meneruskan parameter lain ke dalamnya, sehingga dapat melakukan beberapa logging tambahan.

Belum menemukan kelemahan serius untuk pendekatan saya, kecuali baris kode yang jelek untuk logging.

window.line = function () {
    var error = new Error(''),
        brower = {
            ie: !-[1,], // !!window.ActiveXObject || "ActiveXObject" in window
            opera: ~window.navigator.userAgent.indexOf("Opera"),
            firefox: ~window.navigator.userAgent.indexOf("Firefox"),
            chrome: ~window.navigator.userAgent.indexOf("Chrome"),
            safari: ~window.navigator.userAgent.indexOf("Safari"), // /^((?!chrome).)*safari/i.test(navigator.userAgent)?
        },
        todo = function () {
            // TODO: 
            console.error('a new island was found, please told the line()\'s author(roastwind)');        
        },
        line = (function(error, origin){
            // line, column, sourceURL
            if(error.stack){
                var line,
                    baseStr = '',
                    stacks = error.stack.split('\n');
                    stackLength = stacks.length,
                    isSupport = false;
                // mac版本chrome(55.0.2883.95 (64-bit))
                if(stackLength == 11 || brower.chrome){
                    line = stacks[3];
                    isSupport = true;
                // mac版本safari(10.0.1 (12602.2.14.0.7))
                }else if(brower.safari){
                    line = stacks[2];
                    isSupport = true;
                }else{
                    todo();
                }
                if(isSupport){
                    line = ~line.indexOf(origin) ? line.replace(origin, '') : line;
                    line = ~line.indexOf('/') ? line.substring(line.indexOf('/')+1, line.lastIndexOf(':')) : line;
                }
                return line;
            }else{
                todo();
            }
            return '😭';
        })(error, window.location.origin);
    return line;
}
window.log = function () {
    var _line = window.line.apply(arguments.callee.caller),
        args = Array.prototype.slice.call(arguments, 0).concat(['\t\t\t@'+_line]);
    window.console.log.apply(window.console, args);
}
log('hello');

inilah solusi saya tentang pertanyaan ini. ketika Anda memanggil metode: log, itu akan mencetak nomor baris tempat Anda mencetak log Anda

Variasi kecil adalah memiliki debug () mengembalikan fungsi, yang kemudian dieksekusi di mana Anda membutuhkannya - debug (pesan) (); dan dengan demikian menunjukkan nomor baris yang benar dan skrip panggilan di jendela konsol, sambil memungkinkan variasi seperti mengarahkan ulang sebagai peringatan, atau menyimpan ke file.

var debugmode='console';
var debugloglevel=3;

function debug(msg, type, level) {

  if(level && level>=debugloglevel) {
    return(function() {});
  }

  switch(debugmode) {
    case 'alert':
      return(alert.bind(window, type+": "+msg));
    break;
    case 'console':
      return(console.log.bind(window.console, type+": "+msg));
    break;
    default:
      return (function() {});
  }

}

Karena mengembalikan fungsi, fungsi itu perlu dijalankan pada baris debug dengan () ;. Kedua, pesan dikirim ke fungsi debug, alih-alih ke fungsi yang dikembalikan memungkinkan pra-pemrosesan atau pengecekan yang mungkin Anda butuhkan, seperti memeriksa status tingkat log, membuat pesan lebih mudah dibaca, melompati berbagai jenis, atau hanya melaporkan item memenuhi kriteria tingkat log;

debug(message, "serious", 1)();
debug(message, "minor", 4)();

Anda dapat menyederhanakan logika di sini. Ini mengasumsikan bendera debug global Anda TIDAK dinamis dan ditetapkan pada muat aplikasi atau diteruskan karena beberapa konfigurasi. Ini dimaksudkan untuk digunakan untuk penandaan lingkungan (mis. Hanya mencetak ketika dalam mode dev dan bukan produksi)

Vanilla JS:

(function(window){ 
  var Logger = {},
      noop = function(){};

  ['log', 'debug', 'info', 'warn', 'error'].forEach(function(level){
    Logger[level] = window.isDebug ? window.console[level] : noop;
  });

  window.Logger = Logger;
})(this);

ES6:

((window) => {
  const Logger = {};
  const noop = function(){};

  ['log', 'debug', 'info', 'warn', 'error'].forEach((level) => {
    Logger[level] = window.isDebug ? window.console[level] : noop;
  });

  window.Logger = Logger;
})(this);

Modul:

const Logger = {};
const noop = function(){};

['log', 'debug', 'info', 'warn', 'error'].forEach((level) => {
  Logger[level] = window.isDebug ? window.console[level] : noop;
});

export default Logger;

1.x sudut:

angular
  .module('logger', [])
  .factory('Logger', ['$window',
    function Logger($window) {
      const noop = function(){};
      const logger = {};

      ['log', 'debug', 'info', 'warn', 'error'].forEach((level) => {
        logger[level] = $window.isDebug ? $window.console[level] : noop;
      });

      return logger;
    }
  ]);

Yang perlu Anda lakukan sekarang adalah mengganti semua referensi konsol dengan Logger

Implementasi ini didasarkan pada jawaban yang dipilih dan membantu mengurangi jumlah kebisingan di konsol kesalahan: https://stackoverflow.com/a/32928812/516126

var Logging = Logging || {};

const LOG_LEVEL_ERROR = 0,
    LOG_LEVEL_WARNING = 1,
    LOG_LEVEL_INFO = 2,
    LOG_LEVEL_DEBUG = 3;

Logging.setLogLevel = function (level) {
    const NOOP = function () { }
    Logging.logLevel = level;
    Logging.debug = (Logging.logLevel >= LOG_LEVEL_DEBUG) ? console.log.bind(window.console) : NOOP;
    Logging.info = (Logging.logLevel >= LOG_LEVEL_INFO) ? console.log.bind(window.console) : NOOP;
    Logging.warning = (Logging.logLevel >= LOG_LEVEL_WARNING) ? console.log.bind(window.console) : NOOP;
    Logging.error = (Logging.logLevel >= LOG_LEVEL_ERROR) ? console.log.bind(window.console) : NOOP;

}

Logging.setLogLevel(LOG_LEVEL_INFO);

Saya menemukan beberapa jawaban untuk masalah ini agak terlalu rumit untuk kebutuhan saya. Ini adalah solusi sederhana, disajikan dalam Coffeescript. Ini diadaptasi dari versi Brian Grinstead di sini

Ini mengasumsikan objek konsol global.

# exposes a global 'log' function that preserves line numbering and formatting.
(() ->
    methods = [
      'assert', 'clear', 'count', 'debug', 'dir', 'dirxml', 'error',
      'exception', 'group', 'groupCollapsed', 'groupEnd', 'info', 'log',
      'markTimeline', 'profile', 'profileEnd', 'table', 'time', 'timeEnd',
      'timeStamp', 'trace', 'warn']
    noop = () ->
    # stub undefined methods.
    for m in methods  when  !console[m]
        console[m] = noop

    if Function.prototype.bind?
        window.log = Function.prototype.bind.call(console.log, console);
    else
        window.log = () ->
            Function.prototype.apply.call(console.log, console, arguments)
)()

Cara saya menyelesaikannya adalah dengan membuat objek, kemudian membuat properti baru pada objek menggunakan Object.defineProperty () dan mengembalikan properti konsol, yang kemudian digunakan sebagai fungsi normal, tetapi sekarang dengan kemampuan yang diperluas.

var c = {};
var debugMode = true;

var createConsoleFunction = function(property) {
    Object.defineProperty(c, property, {
        get: function() {
            if(debugMode)
                return console[property];
            else
                return function() {};
        }
    });
};

Kemudian, untuk mendefinisikan properti yang baru saja Anda lakukan ...

createConsoleFunction("warn");
createConsoleFunction("log");
createConsoleFunction("trace");
createConsoleFunction("clear");
createConsoleFunction("error");
createConsoleFunction("info");

Dan sekarang Anda dapat menggunakan fungsi Anda seperti

c.error("Error!");

Berdasarkan jawaban lain (terutama @arctelix satu) saya membuat ini untuk Node ES6, tetapi tes cepat menunjukkan hasil yang baik di browser juga. Saya hanya melewati fungsi lain sebagai referensi.

let debug = () => {};
if (process.argv.includes('-v')) {
    debug = console.log;
    // debug = console; // For full object access
}

Inilah fungsi logger saya (berdasarkan beberapa jawaban). Semoga seseorang dapat memanfaatkannya:

const DEBUG = true;

let log = function ( lvl, msg, fun ) {};

if ( DEBUG === true ) {
    log = function ( lvl, msg, fun ) {
        const d = new Date();
        const timestamp = '[' + d.getHours() + ':' + d.getMinutes() + ':' +
            d.getSeconds() + '.' + d.getMilliseconds() + ']';
        let stackEntry = new Error().stack.split( '\n' )[2];
        if ( stackEntry === 'undefined' || stackEntry === null ) {
            stackEntry = new Error().stack.split( '\n' )[1];
        }
        if ( typeof fun === 'undefined' || fun === null ) {
            fun = stackEntry.substring( stackEntry.indexOf( 'at' ) + 3,
                stackEntry.lastIndexOf( ' ' ) );
            if ( fun === 'undefined' || fun === null || fun.length <= 1 ) {
                fun = 'anonymous';
            }
        }
        const idx = stackEntry.lastIndexOf( '/' );
        let file;
        if ( idx !== -1 ) {
            file = stackEntry.substring( idx + 1, stackEntry.length - 1 );
        } else {
            file = stackEntry.substring( stackEntry.lastIndexOf( '\\' ) + 1,
                stackEntry.length - 1 );
        }
        if ( file === 'undefined' || file === null ) {
            file = '<>';
        }

        const m = timestamp + ' ' + file + '::' + fun + '(): ' + msg;

        switch ( lvl ) {
        case 'log': console.log( m ); break;
        case 'debug': console.log( m ); break;
        case 'info': console.info( m ); break;
        case 'warn': console.warn( m ); break;
        case 'err': console.error( m ); break;
        default: console.log( m ); break;
        }
    };
}

Contoh:

log( 'warn', 'log message', 'my_function' );
log( 'info', 'log message' );