it-swarm.com.de

Chrome JavaScript-Entwicklerkonsole: Kann console.log () ohne Zeilenumbruch aufgerufen werden?

Ich möchte mit console.log () Meldungen protokollieren ohne nach jedem Aufruf von console.log () eine neue Zeile anhängen. Ist das möglich?

75
MitchellSalad

Nein, es ist nicht möglich. Sie müssen einen String beibehalten und verketten, wenn Sie alles in einer Zeile haben oder Ihre Ausgabe an einer anderen Stelle (z. B. in einem anderen Fenster) ablegen möchten.

39
Ry-

In NodeJS können Sie process.stdout.write verwenden und '\ n' hinzufügen, wenn Sie möchten.

console.log(msg) entspricht process.stdout.write(msg + '\n').

28
Pablo Yabo

Sie können so viele Dinge in arguments einfügen, wie Sie möchten:

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

Sie erhalten die gesamte Ausgabe in einer Zeile mit den Objektreferenzen inline, und Sie können die zugehörigen Inspektoren von dort aus ablegen.

13
tkone

Die kurze Antwort lautet nein.

Aber

Wenn Ihr Anwendungsfall den Versuch beinhaltet, Daten ständig zu protokollieren, während die Konsumation aufgebläht wird, besteht eine Möglichkeit (in bestimmten Browsern) darin, vor jeder Ausgabe console.clear() zu verwenden.

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);

Beachten Sie, dass dies möglicherweise andere Protokollierungsfunktionen in Ihrer Anwendung beeinträchtigt.

Haftungsausschluss: Ich würde das als Hack klassifizieren.

11
shennan

Ja, es ist möglich (Schauen Sie sich die Demo unten an) - Implementieren Sie Ihre eigene virtuelle Konsole auf der nativen Browserkonsole und synchronisieren Sie sie mit der echten.

Das ist viel einfacher als es sich anhört:

  1. einen Anzeigepuffer verwalten (z. B. ein Array von Strings, die jeweils eine Zeile darstellen)
  2. rufen Sie console.clear() vor dem Schreiben auf, um alle vorherigen Inhalte zu löschen
  3. rufen Sie console.log() (oder warnen, Fehler usw.) auf, um die Konsole mit dem Inhalt aus Ihrem Anzeigepuffer zu füllen

Eigentlich mache ich das schon einige Zeit. Eine kurze, rudimentäre Umsetzung der Idee wäre etwas in der folgenden Richtung, aber immer noch in der Lage, den Konsoleninhalt zu animieren:

// =================================================
// 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);

Es hat sicher seine Nachteile beim Mixen mit direkter Interaktion mit der Konsole und kann definitiv hässlich aussehen - aber es hat sicherlich seine gültigen Verwendungen, die Sie ohne es nicht erreichen könnten.

4
John Weisz

sammeln Sie Ihre Ausgabe in einem Array und verwenden Sie dann die Join-Funktion mit einem bevorzugten Trennzeichen

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

echo("Apple",3)

Überprüfen Sie auch Array.prototype.join () , um Informationen zum Modus zu erhalten

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

Wenn Sie nur das Drucken in vielen Zeilen beenden möchten, können Sie die Werte gruppieren, wenn Sie nicht möchten, dass sie die gesamte Konsole ausfüllen

P.S.:- Sehen Sie Ihre Browser-Konsole für die Ausgabe

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

Sie können einen Spread-Operator verwenden, um die Ausgabe in einer einzelnen Zeile anzuzeigen. Die neue Funktion von Javascript ES6. siehe unteres Beispiel

   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);
    }

Dadurch werden 1 bis 10 Tabellen in einer Zeile gedruckt.

0
imran khan

Etwas über @shennan Idee:

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