title: ES6 reverse iterate an array using for..of, have I missed something in the spec?
body: <p>In ES6 we now have <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols" rel="noreferrer">iterators</a> and <a href="https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Statements/for...of" rel="noreferrer">for..of</a> to iterate them. we have some built-ins for <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols" rel="noreferrer">arrays</a>; notably <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/keys" rel="noreferrer">keys</a>, <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/values" rel="noreferrer">values</a> and <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/entries" rel="noreferrer">entries</a>.</p>
  
  <p>These methods allow one to perform much of the iteration one would commonly perform. But, what about iteration in reverse? This is also a very common task and I don't see anything in the <a href="http://www.ecma-international.org/ecma-262/6.0/" rel="noreferrer">spec</a> specifically for it? Or maybe I missed it?</p>
  
  <p>Ok, we have <a href="https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/reverse" rel="noreferrer">Array.prototype.reverse</a> but I don't necessarily want to reverse a large array in place and then reverse it again when finished. I also don't want to use <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice" rel="noreferrer">Array.prototype.slice</a> to make a temporary shallow copy and reverse that just for iteration.</p>
  
  <p>So I took a look a <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Iterators_and_Generators" rel="noreferrer">generators</a> and came up with these working solutions.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="false" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>(function() {
    'use strict';
  
    function* reverseKeys(arr) {
      let key = arr.length - 1;
  
      while (key &gt;= 0) {
        yield key;
        key -= 1;
      }
    }
  
    function* reverseValues(arr) {
      for (let key of reverseKeys(arr)) {
        yield arr[key];
      }
    }
  
    function* reverseEntries(arr) {
      for (let key of reverseKeys(arr)) {
        yield [key, arr[key]];
      }
    }
  
    var pre = document.getElementById('out');
  
    function log(result) {
      pre.appendChild(document.createTextNode(result + '\n'));
    }
  
    var a = ['a', 'b', 'c'];
  
    for (var x of reverseKeys(a)) {
      log(x);
    }
  
    log('');
    for (var x of reverseValues(a)) {
      log(x);
    }
  
    log('');
    for (var x of reverseEntries(a)) {
      log(x);
    }
  }());</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;pre id="out"&gt;&lt;/pre&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>Is this really the way that reverse iteration is intended in ES6 or have I missed something fundamental in the spec?</p>