title: JavaScript: correct way to set object parameters with name and default value
body: <p>What I'm trying to do is to pass an object to a function, where certain default values may be set, and the whole object shall have a name to pass it to another function.</p>
  
  <p>The following code, without naming the parameter, works just fine.</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>function test({
    item1,
    item2 = 0
  }) {
    console.log(item1 + " " + item2);
  }
  
  test({
    item1: "foo"
  });
  
  function print(obj) {
    console.log(obj.item1 + " " + obj.item2);
  }</code></pre>
  </div>
  </div>
  </p>
  
  <p>But if I now start setting <code>obj = {...}</code> to pass to <code>print()</code> I get a syntax error:</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>function test(obj = {
    item1,
    item2 = 0
  }) {
    print(obj);
  }
  
  test({
    item1: "foo"
  });
  
  function print(obj) {
    console.log(obj.item1 + " " + obj.item2);
  }</code></pre>
  </div>
  </div>
  </p>
  
  <p>If I write <code>item2: 0</code>, there will be no error, but then in <code>print</code> <code>item2</code> is undefinded.</p>
  
  <hr>
  
  <p>From the answers below, this seems to be the way that works best for me so far:</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>function test(obj) {
    obj = Object.assign({
      item1: undefined,
      item2: 0
    }, obj);
    print(obj);
  }
  
  test({
    item1: "foo"
  });
  
  function print(obj) {
    console.log(obj.item1 + " " + obj.item2);
  }</code></pre>
  </div>
  </div>
  </p>