Podczas śledzenia zmiennych w konsoli, jak utworzyć nową linię?

114

Więc próbuję zrobić coś prostego, chcę podzielić moje ślady w konsoli na kilka linii, używając 1 instrukcji console.log:

console.log('roleName = '+roleName+' role_ID = '+role_ID+' modal_ID = '+modal_ID+\n+'related = '+related);

Jak napisałabyś powyższe, aby prześledzić co następuje?

roleName = test
role_ID = test
modal_UD = test
related = test

zamiast roleName = test role_ID = test modal_UD = test related = test

Sprawdziłem kilka innych pytań, które wydają się podobne, ale żadne nie pomogło ani nie mówią o czymś innym.

Dzięki za przyjrzenie się!

Leon Gaban
źródło

Odpowiedzi:

191

Powinieneś umieścić go w cudzysłowie '\n', patrz poniżej,

console.log('roleName = '+roleName+ '\n' + 
             'role_ID = '+role_ID+  '\n' + 
             'modal_ID = '+modal_ID+ '\n' +  
             'related = '+related);
Selvakumar Arumugam
źródło
1
To było to słodkie, dzięki! Musiałem zobaczyć, jak to zostało napisane
Leon Gaban
41

W ES6 / ES2015 można używać składni literałów łańcuchowych zwanych literałami szablonu . Ciągi szablonów używają znaku odwrotnego kliknięcia zamiast pojedynczego cudzysłowu lub podwójnego cudzysłowu. Zachowują również nowy wiersz i tabulator

const roleName = 'test1';
const role_ID = 'test2';
const modal_ID = 'test3';
const related = 'test4';
        
console.log(`
  roleName = ${roleName}
  role_ID = ${role_ID}
  modal_ID = ${modal_ID}
  related = ${related}
`);

Vlad Bezden
źródło
12

Spokojnie, \nmusi być na sznurku.

Andrei Nemes
źródło
8

Dlaczego nie po prostu użyć osobnych console.log()dla każdej zmiennej i oddzielić je przecinkami zamiast zamieniać je wszystkie na ciągi? To dałoby ci oddzielne wiersze ORAZ prawdziwą wartość każdej zmiennej, a nie jej reprezentację łańcuchową (zakładając, że nie wszystkie mogą być łańcuchami).

console.log('roleName',roleName);
console.log('role_ID',role_ID);
console.log('modal_ID',modal_ID);
console.log('related',related);

Myślę, że byłoby to łatwiejsze do odczytania / utrzymania.

Kevin B.
źródło
Szukałem sposobu na sformatowanie kodu, tak jak napisał go @Vega ... więcej czystsze imho
Leon Gaban
4

Musisz dodać nowy znak linii \n:

console.log('line one \nline two')

wyświetli:

wiersz pierwszy

wiersz drugi

Justin Bicknell
źródło
4

Najgorsza rzecz w używaniu tylko

console.log({'some stuff': 2} + '\n' + 'something')

polega na tym, że wszystkie rzeczy są konwertowane na łańcuch i jeśli potrzebujesz obiektu do pokazania, możesz zobaczyć dalej:

[object Object]

Zatem mój wariant to kolejny kod:

console.log({'some stuff': 2},'\n' + 'something');
Viktor Soroka
źródło
4
console.log('Hello, \n' + 
            'Text under your Header\n' + 
            '-------------------------\n' + 
            'More Text\n' +
            'Moree Text\n' +
            'Moooooer Text\n' );

Działa to świetnie tylko w przypadku tekstu i jest przyjemne dla oka.

misterzik
źródło