title: Why doesn't console.table() work for all objects/arrays?
body: <p>Why doesn't <code>console.table()</code> work for all objects / arrays?</p>
  
  <p>With some data I get a nicely formatted table in the developer console. With other data I get nothing... not even an error message.</p>
  
  <p>I just learned about <code>console.table()</code> while going through the challenges of <a href="https://javascript30.com" rel="noreferrer">#Javascript30</a>. The presenter used <code>console.table()</code> for some of the output, but not all, and he didn't explain why. I tried to use it for all of the (array or object) output and saw why... it doesn't work.</p>
  
  <p>Here's an example of one that doesn't work.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>const data = ['car', 'car', 'truck', 'truck', 'bike', 'walk', 'car', 'van', 'bike', 'walk', 'car', 'van', 'car', 'truck' ];
  
  const transportation = data.reduce((counters, item) =&gt; {
    if (!counters[item]) counters[item] = 0;
    counters[item]++;
    return counters;
  }, {});
  console.log('transportation table');
  console.table(transportation);
  
  console.log('transportation log');
  console.log(transportation);</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;h1&gt;Look at the console!&lt;/h1&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>I expected <code>console.table()</code> to return something like this:</p>
  
  <p><img src="https://mdn.mozillademos.org/files/8567/console-table-array.png" alt="MDN Example"></p>
  
  <p>... except that the (index) column would contain car, truck, bike, etc. and the Values column would contain the count.</p>
  
  <h2>Update</h2>
  
  <p>Apparently <code>console.table()</code> doesn't work with SO's code snippets... which in this case means that it works exactly the same as it does on browsers :P So, I posted an example of the problem at CodePen: <a href="http://codepen.io/VAggrippino/pen/qRraEP" rel="noreferrer">http://codepen.io/VAggrippino/pen/qRraEP</a></p>
  
  <p>This was the 4th challenge, <a href="https://javascript30.com/account/access/587fde5d58e94708b4e66721/view/3dabaeb847" rel="noreferrer">Array Cardio 1</a> for those of you following along.</p>
  
  <p>I realize that this isn't strictly a programming / JavaScript question since the console is a feature of the browser, not the language or the DOM. I believe it's relevant because the browser is an essential tool that all web developers use and every major browser supports it.</p>