1

When sending items to console.log is there a way to name them? Similar to "watch" in visual studio

for example we have a var counter=1; so that in the console log it appears as:

counter 1
counter 2

and so on ....

Liam
  • 27,717
  • 28
  • 128
  • 190
Adin Sijamija
  • 695
  • 2
  • 7
  • 19
  • 5
    You can do something like `console.log("counter",1)` and it will log on the same line. – George Jun 28 '17 at 12:12
  • 2
    Or you can just attach a [debugger and actually watch them](https://stackoverflow.com/questions/988363/how-can-i-debug-my-javascript-code) – Liam Jun 28 '17 at 12:13
  • 1
    Possible duplicate of [How can I debug my JavaScript code?](https://stackoverflow.com/questions/988363/how-can-i-debug-my-javascript-code) – Liam Jun 28 '17 at 12:13
  • 2
    or even [How to 'add watch' in Chrome developer tools?](https://stackoverflow.com/questions/27247350/how-to-add-watch-in-chrome-developer-tools) – Liam Jun 28 '17 at 12:15

4 Answers4

3

Not directly, but you can just name them when you output them.

console.log (and .error, .info, and .warn) let you pass any number of values at the same time, so it's super easy to just do something like this:

console.log('counter', counter);

which would output like:

counter 1


let counter = 0;

for (let i = 0; i < 5; i++) {
  counter++;
  console.log('counter', counter);
}
samanime
  • 25,408
  • 15
  • 90
  • 139
  • It **is** possible to [watch variables](https://stackoverflow.com/questions/27247350/how-to-add-watch-in-chrome-developer-tools) – Liam Jun 28 '17 at 12:14
  • @Liam Yes, it is possible to watch variables. But the question actually asked about naming it in a console, similar to watching. So I answered the console question. – samanime Jun 28 '17 at 12:19
  • That's a very strict interpretation of the question being asked. This is answer is fine, except for the first line, in fact probably just the first two words of the first line. There is a way to directly "log" variables. – Liam Jun 28 '17 at 12:30
  • "When sending items to console.log is there a way to name them?" "Not directly, but you can just name them when you output them.". I believe that is a perfectly accurate answer, unless `console.log` has some magic tricks I'm unaware of. Yes, there are ways to watch variables and debug them directly, especially in Chrome. But without knowing the full context of everything they're doing, it's probably best to just stick with answering the question asked instead of injecting a whole bunch of extra information. They can always ask further questions for further information. – samanime Jun 28 '17 at 12:35
  • *Similar to "watch" in visual studio* Whats more similar to watch than an actual watch – Liam Jun 28 '17 at 12:50
  • @samanime What's about [this trick](https://stackoverflow.com/a/44802396/5978539)? – Maxim Krabov Jun 28 '17 at 14:09
  • That's just wrapping up the `console.log` in a function. While it is a perfectly valid approach if you are doing this prefectly. It isn't a true "watch" though in the sense that Liam is talking about. – samanime Jun 28 '17 at 14:14
2

You could also console log them out inside of an object, so that you're able to have access to its name and value.

var counter = 5;

input:

console.log({counter});

output:

{counter: 5}
ThoughtFool
  • 21
  • 1
0

You can use the label string followed by variable name and a "+" operator in between, as follows:

console.log("Counter : " + counter);
Arun
  • 378
  • 1
  • 11
0

There is one workaround 

function p(variableInObject) {
    let name = Object.keys(variableInObject)[0]
    let value = variableInObject[name] 
    console.log(name, value)
}
let g = 5
p({g}) // g 5
// it even works with loops
for (let i = 0; i < 3; i++) {
  p({i})  // i 0, then i 1, then i 2
}
Maxim Krabov
  • 685
  • 5
  • 17