Chrome JavaScript 开发者控制台：是否可以在没有换行符的情况下调用 console.log()？

Question

I'd like to use console.log() to log messages without appending a new line after each call to console.log(). Is this possible?

Answer 1

No, it's not possible. You'll have to keep a string and concatenate if you want it all in one line, or put your output elsewhere (say, another window).

Answer 2

In NodeJS you can use process.stdout.write and you can add '\\n' if you want.

console.log(msg) is equivalent to process.stdout.write(msg + '\\n') .

Answer 3

Yes, it's possible (check out the demo below) -- by implementing your own virtual console on top of the native browser console, then syncing it to the real one.

This is much easier than it sounds:

1. maintain a display buffer (eg an array of strings representing one line each)
2. call console.clear() before writing to erase any previous contents
3. call console.log() (or warn, error, etc) to fill the console with the contents from your display buffer

Actually, I've been doing this for some time now. A short, rudimentary implementation of the idea would be something along the following lines, but still capable of animating the console contents:

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

It sure has its drawbacks when mixing with direct console interaction, and can definitely look ugly -- but it certainly has its valid uses, which you couldn't achieve without it.

Answer 4

You can put as many things in arguments as you'd like:

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

You'll get all that output on one line with the object references inline and you can then drop down their inspectors from there.

Answer 5

The short answer is no.

But

If your use-case involves attempting to log perpetually changing data while avoiding console-bloat, then one way to achieve this (in certain browsers) would be to use console.clear() before each output.

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

Note that this would probably break any other logging functionality that was taking place within your application.

Disclaimer: I would class this as a hack.

Answer 6

If your only purpose to stop printing on many lines, One way is to group the values if you don't want them to fill your complete console

PS:- See you browser console for output

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

console.group

console.groupCollapsed

Answer 7

Something about @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();

Answer 8

collect your output in an array and then use join function with a preferred separator

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

echo("apple",3)

check also Array.prototype.join() for mode details

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

A simple solution using buffered output. Works with deno and should work with node . (built for porting pascal console programs to 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'); }

To flush the buffer, you should call write() at the end of program. If you mix this with console.log calls, you may get garbage ouput.

Answer 10

You can use a spread operator to display output in the single line. The new feature of javascript ES6. see below example

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

That will print 1 to 10 table in single line.

Answer 11

if you want for example console log array elements without a newline you can do like this

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

Useful for debugging or learning what long chained maps are actually doing.

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