Chrome JavaScript 開發者控制台：是否可以在沒有換行符的情況下調用 console.log()？

Question

我想使用 console.log() 來記錄消息，而無需在每次調用 console.log() 后追加新行。 這可能嗎？

Answer 1

不，這不可能。 如果您希望將其全部放在一行中，則必須保留一個字符串並進行連接，或者將您的輸出放在其他地方（例如，另一個窗口）。

Answer 2

在 NodeJS 中，您可以使用 process.stdout.write 並且可以根據需要添加 '\\n'。

console.log(msg)等價於process.stdout.write(msg + '\\n') 。

Answer 3

是的，這是可能的（查看下面的演示）——通過在本機瀏覽器控制台之上實現您自己的虛擬控制台，然后將其同步到真實控制台。

這比聽起來容易得多：

1. 維護一個顯示緩沖區（例如一個字符串數組，每個字符串代表一行）
2. 在寫入之前調用console.clear()以擦除任何以前的內容
3. 調用console.log() （或警告、錯誤等）用顯示緩沖區中的內容填充控制台

實際上，我已經這樣做了一段時間了。 這個想法的一個簡短的基本實現將是以下幾行，但仍然能夠動畫控制台內容：

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

當與直接的控制台交互混合時，它肯定有其缺點，並且肯定看起來很丑 - 但它肯定有其有效用途，沒有它你就無法實現。

Answer 4

您可以根據需要在arguments放入任意數量的內容：

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

您將在一行中獲得所有輸出，並帶有內聯的對象引用，然后您可以從那里下拉他們的檢查員。

Answer 5

最簡潔的答案是不。

但

如果您的用例涉及嘗試記錄永久更改的數據同時避免控制台膨脹，那么實現此目的的一種方法（在某些瀏覽器中）是在每次輸出之前使用console.clear() 。

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

請注意，這可能會破壞應用程序中發生的任何其他日志記錄功能。

免責聲明：我會將其歸類為黑客。

Answer 6

如果您停止多行打印的唯一目的，一種方法是將值分組，如果您不希望它們填滿整個控制台

PS：-見你的瀏覽器控制台輸出

 let arr = new Array(10).fill(0) console.groupCollapsed('index') arr.forEach((val,index) => { console.log(index) }) console.groupEnd()

控制台組

console.groupCollapsed

Answer 7

關於@shennan 的想法：

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

Answer 8

將您的輸出收集在一個數組中，然后使用帶有首選分隔符的連接函數

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

echo("apple",3)

檢查Array.prototype.join()以獲取模式詳細信息

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

Answer 9

使用緩沖輸出的簡單解決方案。 適用於deno並且應該適用於node 。 （專為將 pascal 控制台程序移植到 javascript 而構建）

const write = (function(){
    let buffer = '';
    return function (text='\n') {
        buffer += text;
        let chunks = buffer.split('\n');
        buffer = chunks.pop();
        for (let chunk of chunks)
            {console.log(chunk);}
    }
})();

function writeln(text) { write(text + '\n'); }

要刷新緩沖區，您應該在程序結束時調用write() 。 如果您將其與console.log調用混合使用，您可能會得到垃圾輸出。

Answer 10

您可以使用擴展運算符在單行中顯示輸出。 javascript ES6 的新特性。 見下面的例子

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

這將在一行中打印 1 到 10 個表。

Answer 11

如果你想要例如沒有換行符的控制台日志數組元素，你可以這樣做

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 

Answer 12

用於調試或學習長鏈映射實際在做什么。

let myConsole = (function(){
    let the_log_buffer=[[]], the_count=0, the_single_line=false;
    const THE_CONSOLE=console, LINE_DIVIDER='  ~  ', ONE_LINE='ONE_LINE',     
          PARAMETER_SEPARATOR= ', ', NEW_LINE = Symbol();
          
    const start = (line_type='NOT_ONE_LINE') => {
        the_log_buffer=[[]];
        the_count=0;
        the_single_line = line_type == ONE_LINE;   
        console = myConsole;  
    }
    const stop = () =>  {
        isNewline();
        console = THE_CONSOLE; 
    };                          
    const isNewline = a_param => {
        if (the_single_line && a_param==NEW_LINE) return;
        const buffer_parts = the_log_buffer.map(one_set=> one_set.join(PARAMETER_SEPARATOR))
        const buffer_line = buffer_parts.join(LINE_DIVIDER);    
        if (the_single_line) {                           
          THE_CONSOLE.clear();
        }
        THE_CONSOLE.log( buffer_line ); 
        the_log_buffer = [[]];
        the_count=0;
    }
    const anObject = an_object => {            
        if (an_object instanceof Error){
            const error_props = [...Object.getOwnPropertyNames(an_object)];
            error_props.map( error_key => an_object['_' + error_key] = an_object[error_key] );
        }
        the_log_buffer[the_count].push(JSON.stringify(an_object));
    }
    const aScalar = a_scalar => {
        if (typeof a_scalar === 'string' && !isNaN(a_scalar)) {
            the_log_buffer[the_count].push("'" + a_scalar + "'");
        } else {
            the_log_buffer[the_count].push(a_scalar);
        }
    }
    const notNewline = a_param => typeof a_param === 'object' ? anObject(a_param):aScalar(a_param);
    const checkNewline = a_param => a_param == NEW_LINE ? isNewline(a_param) : notNewline(a_param);
    const log = (...parameters_list) => {   
        the_log_buffer[the_count]=[];
        parameters_list.map( checkNewline );
        if (the_single_line){
            isNewline(undefined);
        }else{
            const last_log = parameters_list.pop();
            if (last_log !== NEW_LINE){
                the_count++;
            }
        }
    }
    return Object.assign({}, console, {start, stop, log, ONE_LINE, NEW_LINE});
})();

function showConcatLog(){
    myConsole.stop();
    myConsole.start();
    console.log('a');
    console.log('bb');  
    console.dir({i:'not', j:'affected', k:'but not in step'})
    console.log('ccc');
    console.log([1,2,3,4,5,'6'], {x:8, y:'9'});
    console.log("dddd", 1, '2', 3, myConsole.NEW_LINE);
    console.log("z", myConsole.NEW_LINE, 8, '7');
    console.log(new Error("error test"));
    myConsole.stop();
}

myConsole.start(myConsole.ONE_LINE);
var stop_callback = 5;
function myCallback(){
    console.log(stop_callback, 'Date.now()', myConsole.NEW_LINE, Date.now());
    stop_callback--;
    if (stop_callback>0){
        window.setTimeout(myCallback, 1000);
    }else{
        showConcatLog();
    }
}       
window.setTimeout(myCallback, 1000);

Answer 13

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