title: How to add to an already existing array in chrome storage?
body: <p>I'm working with chrome storage for the first time and am having a hard time adding data to an already existing array. 
  I'm attempting to save die roll values so that the keys in the stored object are die types (4, 6, 8, etc.) and the values are arrays of die rolls. </p>
  
  <p>Here's my code: </p>
  
  <pre><code>let storage = chrome.storage.local;
  let json = [];
  chrome.storage.local.set({4: [1,2,3]}, function() {
      console.log('value saved');
      chrome.storage.local.get('4', function(response){
          console.log(response['4']);
      })
  });
  storage.set({6: []});
  storage.set({8: []});
  storage.set({10: []});
  storage.set({20: []});
  
  let button = document.getElementById('submit');
  
  button.addEventListener('click', event =&gt; {
      let dieType = document.querySelector('#dieType');
      console.log(dieType);
      let dieValue = document.querySelector('#rollValue');
      console.log(dieType.value, rollValue.value);
  
      // get existing data
      storage.get(dieType.value, function(existing) {
          console.log(existing[`${dieType.value}`]);
          let die = dieType.value
          let rolls = existing[`${dieType.value}`];
          console.log(rolls);
          let newArray = [];
          //If no existing data, create an array
          //if existing is empty (false) then create an array
          //if existing is not empty(true) then split
          if (existing[`${dieType.value}`] === undefined) {
              console.log('no data stored for die type')
          } else {
              for(items in rolls) {
                  newArray.push(rolls[items]);
              }
          }
          console.log(newArray);
          newArray.push(Number(rollValue.value));
          //save back to storage
          console.log(existing);
          storage.set({die: newArray}, function(result){
              console.log(`${die}: ${newArray} saved`);
              chrome.storage.local.get(die, function(response){
                  console.log(response.die);
              })
          });
      });
  </code></pre>
  
  <p>The console output is: </p>
  
  <pre><code>value saved
  Array(3)
  &lt;select id=​"dieType" name=​"dieType" class=​"select-field"&gt;​&lt;option value=​"null"&gt;​Please Choose One...​&lt;/option&gt;​&lt;option value=​"4"&gt;​D4​&lt;/option&gt;​&lt;option value=​"6"&gt;​D6​&lt;/option&gt;​&lt;option value=​"8"&gt;​D8​&lt;/option&gt;​&lt;option value=​"10"&gt;​D10​&lt;/option&gt;​&lt;option value=​"20"&gt;​D20​&lt;/option&gt;​&lt;/select&gt;​
   4 4 n
  (3) [1, 2, 3]0: 11: 22: 3length: 3__proto__: Array(0)
  (3) [1, 2, 3]
  
  (3) [1, 2, 3]
  {4: Array(3)}4: (3) [1, 2, 3]__proto__: Object
  4: 1,2,3,4 saved
  undefined
  </code></pre>
  
  <p>It seems to me like I haven't actually saved an array back to local storage, and that the array doesn't have the new value. I'm very new at this, so I probably am not understanding exactly how data is represented in chrome storage. </p>