web-dev-qa-db-fra.com

Passer plusieurs arguments à console.log

J'ai une fonction utilitaire qui enveloppe console.log avec une condition. Nous n'appelons donc console.log que si nous sommes dans l'environnement dev et si console.log existe:

/* Console log if environment has debug true or #debug initially passed in URL */
metro.conlog = (function () {
    return function (message) {
        if ((metro.siteData.debug || metro.hashOptions.hasOwnProperty('debug')) && window.console && message) {
            console.log(message);
        }
    };
}());

Cela a très bien fonctionné pour les journaux de console normaux. Mais j'ai récemment découvert les joies de passer plus d'un argument à console.log: cela vous permet de préfixer un journal de console avec une chaîne, donc console.log('DEBUG', object) génère la chaîne avec un objet extensible dont vous pouvez inspecter les propriétés. Comment puis-je changer ma fonction de journal pour faire cela? J'ai essayé de déconnecter tous les arguments comme celui-ci:

metro.conlog = (function () {
    return function (message) {
        if ((metro.siteData.debug || metro.hashOptions.hasOwnProperty('debug')) && window.console && message) {
            console.log(arguments);
        }
    };
}());

Mais cela affiche les arguments sous forme de tableau, au lieu de la ligne soignée obtenue avec console.log. Vous pouvez voir la différence dans cette capture d'écran: 

enter image description here

Quelqu'un peut-il me dire comment je peux reproduire la sortie du journal d'origine?

14
And Finally

Bien sûr, vous pouvez le faire, ceci est une démonstration de la façon de faire exactement ce dont vous avez besoin, avec des options supplémentaires ajoutées.

Et le code est ci-dessous:

var mylog = (function () {
    return {
        log: function() {
            var args = Array.prototype.slice.call(arguments);
            console.log.apply(console, args);
        },
        warn: function() {
            var args = Array.prototype.slice.call(arguments);
            console.warn.apply(console, args);
        },
        error: function() {
            var args = Array.prototype.slice.call(arguments);
            console.error.apply(console, args);
        }
    }
}());

var name = "Alex";
var arr = [1, 2, 3];
var obj = { a:1, b:2, c:3 };
var hello = function(msg){alert(msg);};
mylog.log("Name: ", name);
mylog.log("Window Debug: ", window);
mylog.error("Some error happened");
mylog.warn("Ahh... Warning", arr, obj);
mylog.log("more parameters: ", arr, obj, hello);
26
Idham Perdameian

Essayez quelque chose comme ça

/* Console log if environment has debug true or #debug initially passed in URL */
metro.conlog = (function () {
    return function (message, object) {
        if ((metro.siteData.debug || metro.hashOptions.hasOwnProperty('debug')) && window.console && message) {
            console.log(message, object);
        }
    };
}());

message est quelque chose comme "DEBUG" et object est l'objet que vous voulez examiner.

Si vous voulez pouvoir passer un nombre arbitraire d'arguments dans console.log, je suggérerais d'utiliser la variable arguments.

/* Console log if environment has debug true or #debug initially passed in URL */
    metro.conlog = (function () {
        return function (message, object) {
            if ((metro.siteData.debug || metro.hashOptions.hasOwnProperty('debug')) && window.console && message) {
                console.log(arguments);
            }
        };
    }());

Comme mentionné dans mes commentaires, je ne suis pas sûr que les navigateurs le supportent pleinement (je vous regarde, par exemple).

J'ai testé et confirmé qu'il fonctionne avec Chrome, FireFox et Safari actuels.

1
Justin Wood