title: What does ...this.somefunction() (invocation of a class function preceded by ellipsis) do in javascript in an object assignment?
body: <p>Trying to understand a code snippet. What does <code>...this.savedSettings()</code> do in the following snippet. afaik, ellipsis is used for destructuring and to pass variables to a function (spread syntax)</p>
  
  <pre><code>    constructor(props) {
          super(props);
          this.state = {
              page: 'dashboard',
              ...this.savedSettings(),  // THIS LINE
              setPage: this.setPage,
          };
      }
  
      savedSettings() {
          if(noData) {
              return {page: 'settings', firstVisit: true};            
          }
          return {};
      }
  </code></pre>
  
  <p>PS: I understand that there is a <a href="https://stackoverflow.com/questions/31048953/what-do-these-three-dots-in-react-do">similar question here</a> as mentioned by mod. I did refer to the same before putting this one out. Goes without saying, the spread syntax is subtle and <a href="https://stackoverflow.com/questions/31048953/what-do-these-three-dots-in-react-do">that</a> question was a generic, albeit well answered, question on applying it on an object like props in a React component. It was not immediately clear to me how to apply that here.</p>
  
  <p>This question is more generic as to applying spread syntax against a JS function call. IMHO for someone not very experienced/on the way of being experienced, the subtle difference can be confusing and a question/snippet like this can be profitable.</p>
  
  <p>That said, I've answered this myself. While SE runs promos to ask questions,  they should highlight the fact that it risks reputation. Thanks for the downvotes. </p>