Why the output of console.log and document.write are different? - fibonacci

Question

I tried to write a simple code to print Fibonacci Series in JavaScript.First I tried using 'console.log()'.It gave wrong output.I tried changing variables and it's values.But I could not get correct output.Then I checked in google.I found every line of my code correct except 'console.log()'.They have used 'document.write()' instead of 'console.log'.Can you please explain why 'console.log()' and 'document.write()' is giving different output in following program:
<script>
let a=0;
let b=1;
let c=0;
for(let i=0;i<=10;i++)
{
document.write(a +'</br>');
console.log(a);
c=a+b;
a=b;
b=c;
}
</script>
Output of document.write(): 0,1,1,2,3,5,8,13,21,34,55
Output of console.log(): 0,1,2,3,5,8,13,21,34,55

Answer 1

What you are likely seeing is that the console output is being "stacked." For example, in Chrome DevTools, if the same output is logged to the console multiple times in succession, instead of printing it on multiple lines it just displays a small circle to the left of a single line indicating how many times that output appeared. In your specific example, I would expect to see a small 2 to the left of the 1 in the console output.
See this answer by Benjamin W. for a link to more information, including how to turn this feature off.
Also, be careful with your self-closing tags. The line break in your code sample should appear as: <br /> as noted by the Mozilla web docs.