<p dir="auto">TS 1.7.0</p>
<p dir="auto">This is valid ES6 from Mozilla but invalid TS:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="function drawES6Chart({size = 'big', cords = { x: 0, y: 0 }, radius = 25} = {}) 
{
  console.log(size, cords, radius);
  // do some chart drawing
}

drawES6Chart({
  cords: { x: 18, y: 30 },
  radius: 30
});
"><pre class="notranslate"><code class="notranslate">function drawES6Chart({size = 'big', cords = { x: 0, y: 0 }, radius = 25} = {}) 
{
  console.log(size, cords, radius);
  // do some chart drawing
}

drawES6Chart({
  cords: { x: 18, y: 30 },
  radius: 30
});

</code></pre></div>
<p dir="auto">To get it works, we must remove "= {}", so we can`t invoke function without arguments:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="function drawES6Chart({size = 'big', cords = { x: 0, y: 0 }, radius = 25} ) 
{
  console.log(size, cords, radius);
  // do some chart drawing
}

drawES6Chart( { })  // ok
drawES6Chart()  // Error

"><pre class="notranslate"><code class="notranslate">function drawES6Chart({size = 'big', cords = { x: 0, y: 0 }, radius = 25} ) 
{
  console.log(size, cords, radius);
  // do some chart drawing
}

drawES6Chart( { })  // ok
drawES6Chart()  // Error


</code></pre></div>
<p dir="auto">But It works with array destructuring :</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="function drawES6Chart( [size = &quot;big&quot; ,cords = { x: 0, y: 0 }, radius = 25 ] = [] ) 
{
  console.log(size, cords, radius);
  // do some chart drawing
}
drawES6Chart([]); // Ok
drawES6Chart(); // Ok
"><pre class="notranslate"><code class="notranslate">function drawES6Chart( [size = "big" ,cords = { x: 0, y: 0 }, radius = 25 ] = [] ) 
{
  console.log(size, cords, radius);
  // do some chart drawing
}
drawES6Chart([]); // Ok
drawES6Chart(); // Ok

</code></pre></div>
<p dir="auto">I think empty object should work with default values:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="var {size = 'big', cords = { x: 0, y: 0 } } = {} // Error"><pre class="notranslate"><code class="notranslate">var {size = 'big', cords = { x: 0, y: 0 } } = {} // Error
</code></pre></div>
<p dir="auto">Should it work with no default values ?</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="var {p,q } = {} "><pre class="notranslate"><code class="notranslate">var {p,q } = {} 
</code></pre></div>
<p dir="auto">Firefox screenshoot:<br>
<a target="_blank" rel="noopener noreferrer nofollow" href="https://camo.githubusercontent.com/e11d15cf3a0ea0b83b8ac39adff1312b8826745cafe998bdbde7bd0e4b73c6f0/687474703a2f2f692e696d6775722e636f6d2f314e37634d6b4f2e6a7067"><img src="https://camo.githubusercontent.com/e11d15cf3a0ea0b83b8ac39adff1312b8826745cafe998bdbde7bd0e4b73c6f0/687474703a2f2f692e696d6775722e636f6d2f314e37634d6b4f2e6a7067" alt="Image" data-canonical-src="http://i.imgur.com/1N7cMkO.jpg" style="max-width: 100%;"></a></p>
<div class="highlight highlight-source-ts notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="function foo({ x, y = {}} = { x: 0, y: {}}) {

}

foo(); // Fine
foo({ x: 0, y: 0 }); // Fine
foo({ x: 0 }); // Error"><pre class="notranslate"><span class="pl-k">function</span> <span class="pl-en">foo</span><span class="pl-kos">(</span><span class="pl-kos">{</span> x<span class="pl-kos">,</span> y <span class="pl-c1">=</span> <span class="pl-kos">{</span><span class="pl-kos">}</span><span class="pl-kos">}</span> <span class="pl-c1">=</span> <span class="pl-kos">{</span> <span class="pl-c1">x</span>: <span class="pl-c1">0</span><span class="pl-kos">,</span> <span class="pl-c1">y</span>: <span class="pl-kos">{</span><span class="pl-kos">}</span><span class="pl-kos">}</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>

<span class="pl-kos">}</span>

<span class="pl-en">foo</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// Fine</span>
<span class="pl-en">foo</span><span class="pl-kos">(</span><span class="pl-kos">{</span> <span class="pl-c1">x</span>: <span class="pl-c1">0</span><span class="pl-kos">,</span> <span class="pl-c1">y</span>: <span class="pl-c1">0</span> <span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// Fine</span>
<span class="pl-en">foo</span><span class="pl-kos">(</span><span class="pl-kos">{</span> <span class="pl-c1">x</span>: <span class="pl-c1">0</span> <span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// Error</span></pre></div>
<p dir="auto">The last line should not be an error because the y property has a default initializer. The error goes away if I remove the default initializer <code class="notranslate">{ x: 0, y: {}}</code> on the parent.</p>
<p dir="auto">I think the rule would be that even if we get the type of a parameter / variable / binding element from an initializer, we still have to traverse the binding pattern to determine whether binding properties are optional.</p>