title: How to add or append new stateObject to history
body: <p>I have the following code to save my <code>data</code> in current page state.</p>
  
  <pre><code>window.history.pushState({myData: data}, "RandomTitle", '#');
  </code></pre>
  
  <p>But now, I want to also save another value which is <code>scrollTop</code>. And if I do</p>
  
  <pre><code>window.history.pushState({scrollTop: scrollTop}, "RandomTitle", '#');
  </code></pre>
  
  <p>The code above will replace the history state with the new one and <code>myData</code> will be gone.</p>
  
  <p>The question, Is there anyway I can add <code>scrollTop</code> while there's <code>myData</code> in my history state? Or I just have to set it initially like,</p>
  
  <pre><code>window.history.pushState({myData: data, scrollTop: 0}, "RandomTitle", '#');
  // To change the scrollTop in history state
  window.history.state.scrollTop = $(window).scrollTop();
  </code></pre>
  
  <p>I am thinking if there's a function like <code>window.history.state.addObject</code> or something.</p>