Konsola programisty Chrome JavaScript: czy można wywołać console.log () bez znaku nowej linii?

93

Chciałbym używać console.log () do rejestrowania komunikatów bez dodawania nowego wiersza po każdym wywołaniu console.log (). czy to możliwe?

MitchellSalad
źródło
10
Czy jedna z odpowiedzi była poprawna?
newenglander
Myślę, że odpowiedź @ minitech jest prawidłowa: nie jest to możliwe. Inne odpowiedzi dostarczają interesującej, choć nieco ortogonalnej głębi naszego zrozumienia console.log ().
Dave Land
1
@DaveLand Wierzę, że jest to całkowicie możliwe , utrzymując własny bufor wyświetlania i synchronizując ten bufor wyświetlania z rzeczywistą konsolą za pomocą kombinacji console.clear()i, np console.log().
John Weisz
1
@JohnWeisz: Dzięki, ale wyczyszczenie całej konsoli przy każdej „wbudowanej” aktualizacji nie jest rozwiązaniem dla około 99% aplikacji. Mimo to miej aktualizację.
Dave Land
@DaveLand Tak, to bardziej przypomina hack - a teraz, gdy się rozejrzałem, zdałem sobie sprawę, że zostało to zaproponowane wcześniej. Tak czy inaczej, czasami może się przydać.
John Weisz

Odpowiedzi:

45

Nie, to niemożliwe. Będziesz musiał zachować ciąg i połączyć go, jeśli chcesz to wszystko w jednej linii, lub umieścić swoje wyjście w innym miejscu (powiedzmy, w innym oknie).

Ry-
źródło
2
Właściwie jest to możliwe, ale może nie do użytku, o którym wszyscy myślą. W moim przypadku po prostu próbowałem wydrukować pytanie, aby uzyskać dane wejściowe z terminala wiersza poleceń. Zobacz odpowiedź na to pytanie, aby uzyskać odpowiedź: stackoverflow.com/questions/26683734/…
deltaray
2
@deltaray readline's questionnie jest console.log. Pytanie dotyczy również konsoli przeglądarki, a nie Node.js.
Ry-
@minitech możesz użyć operatora rozprzestrzeniania, aby wydrukować w jednej linii. patrz na przykładzie jsfiddle.net/imranqau5373/7m65at9L/2
khan
@imrankhan: Nie o to chodziło. Operator spreadu nie dodaje tutaj nic nowego w porównaniu do przekazywania wielu argumentów / używania apply.
Ry-
40

W NodeJS możesz użyć process.stdout.write i możesz dodać '\ n', jeśli chcesz.

console.log(msg)jest równoważne process.stdout.write(msg + '\n').

Pablo Yabo
źródło
15
NodeJS to nie Chrome. Ta odpowiedź nie ma związku z pytaniem „czy możesz console.log bez nowej linii?” .
Alex
17

Możesz włożyć tyle rzeczy, argumentsile chcesz:

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

Otrzymasz wszystkie dane wyjściowe w jednym wierszu z wbudowanymi odwołaniami do obiektów, a następnie możesz z tego miejsca upuścić ich inspektorów.

tkone
źródło
62
Jak to odpowiada na pytanie?
JohnAllen
16
Myślę, że ta odpowiedź jest przydatna.
12
To jest przydatne. Mimo że nie odpowiada na pytanie, zapewnia rozwiązanie tego, czego większość ludzi szukałaby, gdy znalazła to pytanie.
Sean Lynch,
1
Powodem, dla którego ktokolwiek chciałby drukować bez nowej linii jest to, że następujący wynik nie jest znany. Lub po prostu wyobraź sobie „pasek ładowania” zawierający np. Kropki.
Karl Adler,
Użycie wielu argumentów powoduje przerwanie stylizacji console.log, ponieważ styl można przypisać tylko do pierwszego argumentu.
Qwerty
17

Tak, to możliwe (sprawdź demo poniżej) - implementując własną konsolę wirtualną na natywnej konsoli przeglądarki, a następnie synchronizując ją z prawdziwą.

To jest o wiele łatwiejsze niż się wydaje:

  1. utrzymywać bufor wyświetlania (np. tablicę ciągów reprezentujących po jednej linii)
  2. połączenie console.clear() przed napisaniem, aby usunąć wszelkie wcześniejsze treści
  3. call console.log()(lub ostrzeżenie, błąd itp.), aby wypełnić konsolę zawartością z bufora wyświetlania

Właściwie robię to już od jakiegoś czasu. Krótka, prymitywna realizacja pomysłu byłaby podobna, ale nadal zdolna do animowania zawartości konsoli:

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

Z pewnością ma swoje wady podczas miksowania z bezpośrednią interakcją z konsolą i zdecydowanie może wyglądać brzydko - ale z pewnością ma swoje ważne zastosowania, których nie można osiągnąć bez niego.

John Weisz
źródło
2
To najlepsza odpowiedź. Możesz nawet zainicjować, powiedzmy max wiersze, które utrzymują stos logów wystarczająco krótki, abyś nie zapisywał ogromnego zestawu danych.
Matt Way
12

Krótka odpowiedź brzmi: nie.

Ale

Jeśli twój przypadek użycia obejmuje próbę rejestrowania wiecznie zmieniających się danych, unikając rozdęcia konsoli, to jednym ze sposobów osiągnięcia tego (w niektórych przeglądarkach) byłoby użycie console.clear()przed każdym wyjściem.

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

Zauważ, że prawdopodobnie zepsułoby to jakiekolwiek inne funkcje rejestrowania, które miały miejsce w twojej aplikacji.

Zastrzeżenie: uznałbym to za hack.

shennan
źródło
3
Bardzo hack, ale sprytny. Jeśli prześledziłeś, co zostało już zarejestrowane w konsoli (powiedzmy, utrzymując jakiś rodzaj wirtualnego bufora), możesz odbudować bufor i dołączać nowy ciąg za każdym razem, gdy wyczyścisz.
danShumway
2

Jeśli Twoim jedynym celem jest zatrzymanie drukowania w wielu wierszach, jednym ze sposobów jest zgrupowanie wartości, jeśli nie chcesz, aby wypełniały całą konsolę

PS: - Do zobaczenia w konsoli przeglądarki do wyjścia

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


console.groupCollapsed('index')

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

console.groupEnd()

console.group

console.groupCollapsed

Code Maniac
źródło
1

Coś o pomyśle @shennan:

vp_arth
źródło
1

zbierz dane wyjściowe w tablicy, a następnie użyj funkcji łączenia z preferowanym separatorem

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

echo("apple",3)

sprawdź również Array.prototype.join (), aby uzyskać szczegółowe informacje o trybie

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
Ahmed Younes
źródło
0

Aby wyświetlić dane wyjściowe w jednym wierszu, można użyć operatora spreadu. Nowa funkcja javascript ES6. patrz poniższy przykład

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

Spowoduje to wydrukowanie od 1 do 10 tabel w jednej linii.

imran khan
źródło
0

jeśli chcesz, na przykład, elementy tablicy dziennika konsoli bez znaku nowej linii, możesz to zrobić w ten sposób

const arr = [1,2,3,4,5];

Array.prototype.log = (sep='') => {
    let res = '';
    for(let j=0; j<this.lengthl j++){
        res += this[j];
        res += sep;
    }
    console.log(res);
}

// console loging

arr.log(sep=' '); // result is: 1 2 3 4 5 
niektórzy widzą pióro, ja widzę harpun
źródło
-3
// Source code for printing 2d array
window.onload = function () {
    var A = [[1, 2], [3, 4]];
    Print(A);
}

function Print(A) {
    var rows = A.length;
    var cols = A[0].length;
    var line = "";
    for (var r = 0; r < rows; r++) {
        line = "";
        for (var c = 0; c < cols; c++) {
            line += A[r][c] + " ";
        }
        console.log(line);
    }
}
Tak
źródło
1
A.forEach(row => console.log(row.join(' ')))
vp_arth