web-dev-qa-db-fra.com

Console du développeur JavaScript Chrome: Est-il possible d'appeler console.log () sans nouvelle ligne?

J'aimerais utiliser console.log () pour consigner des messages sans ajouter une nouvelle ligne après chaque appel à console.log (). Est-ce possible?

javascriptgoogle-chromeconsolelogging
75
MitchellSalad

Non, ce n'est pas possible Vous devrez garder une chaîne et concaténer si vous voulez tout dans une ligne, ou mettez votre sortie ailleurs (par exemple, une autre fenêtre).

39
Ry-

Dans NodeJS, vous pouvez utiliser process.stdout.write et vous pouvez ajouter '\ n' si vous le souhaitez.

console.log(msg) est équivalent à process.stdout.write(msg + '\n').

28
Pablo Yabo

Vous pouvez mettre autant de choses dans arguments que vous le souhaitez:

console.log('hi','these','words','will','be','separated','by','spaces',window,document)

Vous obtiendrez toutes ces sorties sur une seule ligne avec les références d'objet en ligne et vous pourrez ensuite déposer leurs inspecteurs à partir de là.

13
tkone

La réponse courte est non.

Mais

Si votre cas d'utilisation implique de tenter de consigner des données constamment changeantes tout en évitant le gonflement de la console, un moyen d'y parvenir (dans certains navigateurs) serait d'utiliser console.clear() avant chaque sortie.

function writeSingleLine (msg) {

  console.clear();
  console.log(msg);

}

writeSingleLine('this');
setTimeout( function () { writeSingleLine('is'); }, 1000);
setTimeout( function () { writeSingleLine('a'); }, 2000);
setTimeout( function () { writeSingleLine('hack'); }, 3000);

Notez que cela casserait probablement toute autre fonctionnalité de journalisation en cours dans votre application.

Disclaimer: Je classerais cela comme un hack.

11
shennan

Oui, c'est possible (consultez la démo ci-dessous) - en implémentant votre propre console virtuelle par-dessus la console du navigateur natif, puis en la synchronisant sur la console réelle.

C'est beaucoup plus facile que ça en a l'air:

  1. maintenir un tampon d'affichage (par exemple, un tableau de chaînes représentant une ligne chacune)
  2. appelez console.clear() avant d'écrire pour effacer le contenu précédent
  3. appelez console.log() (ou warn, error, etc) pour remplir la console avec le contenu de votre tampon d'affichage

En fait, je le fais depuis un certain temps maintenant. Une mise en œuvre brève et rudimentaire de l’idée ressemblerait à quelque chose, mais elle serait tout de même capable de animer le contenu de la console:

// =================================================
// Rudimentary implementation of a virtual console.
// =================================================

var virtualConsole = {
    lines: [],
    currentLine: 0,
    log: function (msg, appendToCurrentLine) {
        if (!appendToCurrentLine) virtualConsole.currentLine++;
      
        if (appendToCurrentLine && virtualConsole.lines[virtualConsole.currentLine]) {
            virtualConsole.lines[virtualConsole.currentLine] += msg;
        } else {
            virtualConsole.lines[virtualConsole.currentLine] = msg;
        }
        
        console.clear();
        
        virtualConsole.lines.forEach(function (line) {
            console.log(line);
        });
    },
    clear: function () {
        console.clear();
        virtualConsole.currentLine = 0;
    }
}

// =================================================
// Little demo to demonstrate how it looks.
// =================================================

// Write an initial console entry.
virtualConsole.log("Loading");

// Append to last line a few times.
var loadIndicatorInterval = setInterval(function () {
    virtualConsole.log(".", true); // <- Append.
}, 500);

// Write a new line.
setTimeout(function () {
    clearInterval(loadIndicatorInterval);
    virtualConsole.log("Finished."); // <- New line.
}, 8000);

Il a certes des inconvénients lors du mixage avec une interaction directe avec la console, et peut certainement paraître moche - mais il a certainement des utilisations valables, que vous ne pourriez pas réaliser sans elle.

4
John Weisz

collectez votre sortie dans un tableau, puis utilisez la fonction join avec un séparateur préféré

function echo(name, num){
    var ar= [];
    for(var i =0;i<num;i++){
        ar.Push(name);
    }
    console.log(ar.join(', '));
}

echo("Apple",3)

vérifiez également Array.prototype.join () pour les détails du mode

var elements = ['Fire', 'Wind', 'Rain'];

console.log(elements.join());
// expected output: Fire,Wind,Rain

console.log(elements.join(''));
// expected output: FireWindRain

console.log(elements.join('-'));
// expected output: Fire-Wind-Rain
1
Ahmed Younes

Si votre seul objectif est d’arrêter d’imprimer sur plusieurs lignes, vous pouvez, par exemple, regrouper les valeurs si vous ne souhaitez pas qu’elles remplissent votre console complète.

P.S.:- Consultez la console de votre navigateur pour la sortie

let arr = new Array(10).fill(0)


console.groupCollapsed('index')

arr.forEach((val,index) => {
  console.log(index)
})

console.groupEnd()

console.group

console.groupCollapsed

1
Code Maniac

Vous pouvez utiliser un opérateur d'étalement pour afficher la sortie sur une seule ligne. La nouvelle fonctionnalité de javascript ES6. voir ci-dessous exemple

   for(let i = 1; i<=10; i++){
        let arrData = [];
        for(let j = 1; j<= 10; j++){
            arrData.Push(j+"X"+i+"="+(j*i));
        }
        console.log(...arrData);
    }

Cela imprimera 1 à 10 tableau en une seule ligne.

0
imran khan

Quelque chose à propos de @shennan idea:

function init(poolSize) {
      var pool = [];
      console._log = console.log;
      console.log = function log() {
        pool.Push(arguments);
        while (pool.length > poolSize) pool.shift();
    
        draw();
      }
      console.toLast = function toLast() {
        while (pool.length > poolSize) pool.shift();
        var last = pool.pop() || [];
        for (var a = 0; a < arguments.length; a++) {
            last[last.length++] = arguments[a];
        }
        pool.Push(last);
    
        draw();
      }
      function draw() {
        console.clear();
        for(var i = 0; i < pool.length; i++)
          console._log.apply(console, pool[i]);
      }
    }
    
    function restore() {
      console.log = console._log;
      delete console._log;
      delete console.toLast;
    }
    
    init(3);
    console.log(1);
    console.log(2);
    console.log(3);
    console.log(4);    // 1 will disappeared here
    console.toLast(5); // 5 will go to row with 4
    restore();

0
vp_arth