title: Uncaught TypeError: items is not iterable
body: <p>My understanding is that <code>for...in</code> loops are designed to iterate over objects in Javascript. <a href="https://stackoverflow.com/questions/5263847/javascript-loops-for-in-vs-for">See this post</a> and <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...in" rel="noreferrer">this post.</a></p>
  
  <p>Take the following example. This returns 'Uncaught TypeError: items is not iterable' in my console. </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>var text = {
    name: "Coptic",
    ranges: [[994, 1008], [11392, 11508], [11513, 11520]],
    direction: "ltr",
    year: -200,
    living: false,
    link: "https://en.wikipedia.org/wiki/Coptic_alphabet"
  };
  
  function dominantDirection(items) {
    for (let item of items) {
      if (item.direction === 'ltr') {
        return 'ltr';
      } else {
        return 'rtl';
      }
    }
  }
  
  console.log(dominantDirection(text));</code></pre>
  </div>
  </div>
  </p>
  
  <p>If I wrap the object in an array[] it works fine.
  However my second example works as expected. </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>var object1 = {a: 1, b: 2, c: 3};
  var string1 = "";
  
  function loopObj() {
    for (var property1 in object1) {
      console.log(string1 = string1 + object1[property1]);
    }
  }
  
  console.log(loopObj());</code></pre>
  </div>
  </div>
  </p>
  
  <p>Why does the first example require an array and the second does not?</p>