<div dir="auto">Indeed. I see your point.<div dir="auto"><br></div><div dir="auto">But it really needs to be falsy check.</div><div dir="auto">Since falsy values are not "spreadable" </div><div dir="auto"><br></div><br><br><div class="gmail_quote" dir="auto"><div dir="ltr" class="gmail_attr">On Fri, 23 Aug 2019, 03:52 Scott Rudiger, <<a href="mailto:scottrudiger@gmail.com">scottrudiger@gmail.com</a>> wrote:<br></div><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex"><div dir="auto"><div>I like it; code seems cleaner to me with its use. However, since the syntax is so similar to optional chaining, it's too bad your goal with this sample is to check for falsey values rather than nullish values.</div><div dir="auto"><br></div><div dir="auto"><span style="color:rgb(248,248,248);font-family:consolas,menlo,monaco,"lucida console","liberation mono","dejavu sans mono","bitstream vera sans mono","courier new",monospace;font-size:15px;white-space:pre-wrap;background-color:rgb(51,51,51)">[                                          
  </span><span style="font-family:consolas,menlo,monaco,"lucida console","liberation mono","dejavu sans mono","bitstream vera sans mono","courier new",monospace;font-size:15px;white-space:pre-wrap;background-color:rgb(51,51,51);color:rgb(170,255,255)">1</span><span style="color:rgb(248,248,248);font-family:consolas,menlo,monaco,"lucida console","liberation mono","dejavu sans mono","bitstream vera sans mono","courier new",monospace;font-size:15px;white-space:pre-wrap;background-color:rgb(51,51,51)">,                                       
  ?...(condition && [</span><span style="font-family:consolas,menlo,monaco,"lucida console","liberation mono","dejavu sans mono","bitstream vera sans mono","courier new",monospace;font-size:15px;white-space:pre-wrap;background-color:rgb(51,51,51);color:rgb(170,255,255)">2</span><span style="color:rgb(248,248,248);font-family:consolas,menlo,monaco,"lucida console","liberation mono","dejavu sans mono","bitstream vera sans mono","courier new",monospace;font-size:15px;white-space:pre-wrap;background-color:rgb(51,51,51)">, </span><span style="font-family:consolas,menlo,monaco,"lucida console","liberation mono","dejavu sans mono","bitstream vera sans mono","courier new",monospace;font-size:15px;white-space:pre-wrap;background-color:rgb(51,51,51);color:rgb(170,255,255)">3</span><span style="color:rgb(248,248,248);font-family:consolas,menlo,monaco,"lucida console","liberation mono","dejavu sans mono","bitstream vera sans mono","courier new",monospace;font-size:15px;white-space:pre-wrap;background-color:rgb(51,51,51)">]), </span><span style="font-family:consolas,menlo,monaco,"lucida console","liberation mono","dejavu sans mono","bitstream vera sans mono","courier new",monospace;font-size:15px;white-space:pre-wrap;background-color:rgb(51,51,51);color:rgb(187,187,170);font-style:italic">// no extras:)</span><span style="color:rgb(248,248,248);font-family:consolas,menlo,monaco,"lucida console","liberation mono","dejavu sans mono","bitstream vera sans mono","courier new",monospace;font-size:15px;white-space:pre-wrap;background-color:rgb(51,51,51)">
  </span><span style="font-family:consolas,menlo,monaco,"lucida console","liberation mono","dejavu sans mono","bitstream vera sans mono","courier new",monospace;font-size:15px;white-space:pre-wrap;background-color:rgb(51,51,51);color:rgb(170,255,255)">3</span><span style="color:rgb(248,248,248);font-family:consolas,menlo,monaco,"lucida console","liberation mono","dejavu sans mono","bitstream vera sans mono","courier new",monospace;font-size:15px;white-space:pre-wrap;background-color:rgb(51,51,51)">,                                       
]                                          </span><br><br><div class="gmail_quote" dir="auto"><div dir="ltr" class="gmail_attr">On Thu, Aug 22, 2019, 6:01 PM Beknar Askarov <<a href="mailto:beknaraskarov@gmail.com" target="_blank" rel="noreferrer">beknaraskarov@gmail.com</a>> wrote:<br></div><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex"><div dir="ltr"><div><h1 style="font-size:1.5157em;margin:0px 0px 10px;line-height:1.2;color:rgb(255,255,255);font-family:Helvetica,Arial,sans-serif;background-color:rgb(51,51,51)">Problem</h1><p style="margin-top:0px;color:rgb(255,255,255);font-family:Helvetica,Arial,sans-serif;font-size:15px;background-color:rgb(51,51,51)">Spreading is great! It contributes towards "declerativity" of the language and reduces verbosity. I see one more feature to add to improve it.</p><p style="color:rgb(255,255,255);font-family:Helvetica,Arial,sans-serif;font-size:15px;background-color:rgb(51,51,51)">Consider following</p><pre style="overflow:auto;font-family:Consolas,Menlo,Monaco,"Lucida Console","Liberation Mono","DejaVu Sans Mono","Bitstream Vera Sans Mono","Courier New",monospace;font-size:15px;color:rgb(255,255,255);background-color:rgb(51,51,51)"><code class="m_-472946250027792104m_3881212086764909428gmail-lang-javascript m_-472946250027792104m_3881212086764909428gmail-hljs" style="font-family:Consolas,Menlo,Monaco,"Lucida Console","Liberation Mono","DejaVu Sans Mono","Bitstream Vera Sans Mono","Courier New",monospace;font-size:1em;overflow:auto;display:block;padding:0.5em;color:rgb(248,248,248);background-image:initial;background-position:initial;background-size:initial;background-repeat:initial;background-origin:initial;background-clip:initial;max-height:500px">[
  <span class="m_-472946250027792104m_3881212086764909428gmail-hljs-number" style="color:rgb(170,255,255)">1</span>,
  condition && <span class="m_-472946250027792104m_3881212086764909428gmail-hljs-number" style="color:rgb(170,255,255)">2</span>,
  condition && <span class="m_-472946250027792104m_3881212086764909428gmail-hljs-number" style="color:rgb(170,255,255)">3</span>,
  <span class="m_-472946250027792104m_3881212086764909428gmail-hljs-number" style="color:rgb(170,255,255)">4</span>,
].filter(<span class="m_-472946250027792104m_3881212086764909428gmail-hljs-built_in" style="color:rgb(244,123,3)">Boolean</span>) <span class="m_-472946250027792104m_3881212086764909428gmail-hljs-comment" style="color:rgb(187,187,170);font-style:italic">// filtering needed to remove falsy values</span>

<span class="m_-472946250027792104m_3881212086764909428gmail-hljs-comment" style="color:rgb(187,187,170);font-style:italic">// Results in </span>
[<span class="m_-472946250027792104m_3881212086764909428gmail-hljs-number" style="color:rgb(170,255,255)">1</span>, <span class="m_-472946250027792104m_3881212086764909428gmail-hljs-number" style="color:rgb(170,255,255)">2</span>, <span class="m_-472946250027792104m_3881212086764909428gmail-hljs-number" style="color:rgb(170,255,255)">3</span>, <span class="m_-472946250027792104m_3881212086764909428gmail-hljs-number" style="color:rgb(170,255,255)">4</span>] <span class="m_-472946250027792104m_3881212086764909428gmail-hljs-comment" style="color:rgb(187,187,170);font-style:italic">// if condition is `truthy`</span>
<span class="m_-472946250027792104m_3881212086764909428gmail-hljs-comment" style="color:rgb(187,187,170);font-style:italic">// and</span>
[<span class="m_-472946250027792104m_3881212086764909428gmail-hljs-number" style="color:rgb(170,255,255)">1</span>, <span class="m_-472946250027792104m_3881212086764909428gmail-hljs-number" style="color:rgb(170,255,255)">4</span>] <span class="m_-472946250027792104m_3881212086764909428gmail-hljs-comment" style="color:rgb(187,187,170);font-style:italic">// if not truthy.</span>
</code></pre><p style="color:rgb(255,255,255);font-family:Helvetica,Arial,sans-serif;font-size:15px;background-color:rgb(51,51,51)">Another way to achieve the same result without the need of filtering after</p><pre style="overflow:auto;font-family:Consolas,Menlo,Monaco,"Lucida Console","Liberation Mono","DejaVu Sans Mono","Bitstream Vera Sans Mono","Courier New",monospace;font-size:15px;color:rgb(255,255,255);background-color:rgb(51,51,51)"><code class="m_-472946250027792104m_3881212086764909428gmail-lang-javascript m_-472946250027792104m_3881212086764909428gmail-hljs" style="font-family:Consolas,Menlo,Monaco,"Lucida Console","Liberation Mono","DejaVu Sans Mono","Bitstream Vera Sans Mono","Courier New",monospace;font-size:1em;overflow:auto;display:block;padding:0.5em;color:rgb(248,248,248);background-image:initial;background-position:initial;background-size:initial;background-repeat:initial;background-origin:initial;background-clip:initial;max-height:500px">[
  <span class="m_-472946250027792104m_3881212086764909428gmail-hljs-number" style="color:rgb(170,255,255)">1</span>,
   ...(condition ? [<span class="m_-472946250027792104m_3881212086764909428gmail-hljs-number" style="color:rgb(170,255,255)">2</span>, <span class="m_-472946250027792104m_3881212086764909428gmail-hljs-number" style="color:rgb(170,255,255)">3</span>] : []), <span class="m_-472946250027792104m_3881212086764909428gmail-hljs-comment" style="color:rgb(187,187,170);font-style:italic">// note extra [] in the end, to avoid errors</span>
  <span class="m_-472946250027792104m_3881212086764909428gmail-hljs-number" style="color:rgb(170,255,255)">4</span>,
]
</code></pre><p style="color:rgb(255,255,255);font-family:Helvetica,Arial,sans-serif;font-size:15px;background-color:rgb(51,51,51)">Similar pattern with objects</p><pre style="overflow:auto;font-family:Consolas,Menlo,Monaco,"Lucida Console","Liberation Mono","DejaVu Sans Mono","Bitstream Vera Sans Mono","Courier New",monospace;font-size:15px;color:rgb(255,255,255);background-color:rgb(51,51,51)"><code class="m_-472946250027792104m_3881212086764909428gmail-lang-javascript m_-472946250027792104m_3881212086764909428gmail-hljs" style="font-family:Consolas,Menlo,Monaco,"Lucida Console","Liberation Mono","DejaVu Sans Mono","Bitstream Vera Sans Mono","Courier New",monospace;font-size:1em;overflow:auto;display:block;padding:0.5em;color:rgb(248,248,248);background-image:initial;background-position:initial;background-size:initial;background-repeat:initial;background-origin:initial;background-clip:initial;max-height:500px">{
  ...(condition ? { <span class="m_-472946250027792104m_3881212086764909428gmail-hljs-attr">foo</span>: <span class="m_-472946250027792104m_3881212086764909428gmail-hljs-string" style="color:rgb(255,153,153)">'bar'</span> } : {}), <span class="m_-472946250027792104m_3881212086764909428gmail-hljs-comment" style="color:rgb(187,187,170);font-style:italic">// extra {}</span>
}
</code></pre><p style="color:rgb(255,255,255);font-family:Helvetica,Arial,sans-serif;font-size:15px;background-color:rgb(51,51,51)">Another pattern is when <code style="font-family:Consolas,Menlo,Monaco,"Lucida Console","Liberation Mono","DejaVu Sans Mono","Bitstream Vera Sans Mono","Courier New",monospace;font-size:1em;color:rgb(248,248,248);background-image:initial;background-position:initial;background-size:initial;background-repeat:initial;background-origin:initial;background-clip:initial">condition</code> is the object itself, when it is known that type is one or <code style="font-family:Consolas,Menlo,Monaco,"Lucida Console","Liberation Mono","DejaVu Sans Mono","Bitstream Vera Sans Mono","Courier New",monospace;font-size:1em;color:rgb(248,248,248);background-image:initial;background-position:initial;background-size:initial;background-repeat:initial;background-origin:initial;background-clip:initial">falsy</code></p><pre style="overflow:auto;font-family:Consolas,Menlo,Monaco,"Lucida Console","Liberation Mono","DejaVu Sans Mono","Bitstream Vera Sans Mono","Courier New",monospace;font-size:15px;color:rgb(255,255,255);background-color:rgb(51,51,51)"><code class="m_-472946250027792104m_3881212086764909428gmail-lang-javascript m_-472946250027792104m_3881212086764909428gmail-hljs" style="font-family:Consolas,Menlo,Monaco,"Lucida Console","Liberation Mono","DejaVu Sans Mono","Bitstream Vera Sans Mono","Courier New",monospace;font-size:1em;overflow:auto;display:block;padding:0.5em;color:rgb(248,248,248);background-image:initial;background-position:initial;background-size:initial;background-repeat:initial;background-origin:initial;background-clip:initial;max-height:500px">[
  item1,
  item2,
  ...(itemsOrNull || []) <span class="m_-472946250027792104m_3881212086764909428gmail-hljs-comment" style="color:rgb(187,187,170);font-style:italic">// extra []</span>
]
</code></pre><p style="color:rgb(255,255,255);font-family:Helvetica,Arial,sans-serif;font-size:15px;background-color:rgb(51,51,51)">Similar for objects</p><pre style="overflow:auto;font-family:Consolas,Menlo,Monaco,"Lucida Console","Liberation Mono","DejaVu Sans Mono","Bitstream Vera Sans Mono","Courier New",monospace;font-size:15px;color:rgb(255,255,255);background-color:rgb(51,51,51)"><code class="m_-472946250027792104m_3881212086764909428gmail-lang-javascript m_-472946250027792104m_3881212086764909428gmail-hljs" style="font-family:Consolas,Menlo,Monaco,"Lucida Console","Liberation Mono","DejaVu Sans Mono","Bitstream Vera Sans Mono","Courier New",monospace;font-size:1em;overflow:auto;display:block;padding:0.5em;color:rgb(248,248,248);background-image:initial;background-position:initial;background-size:initial;background-repeat:initial;background-origin:initial;background-clip:initial;max-height:500px">{
  ...(obj || {}), <span class="m_-472946250027792104m_3881212086764909428gmail-hljs-comment" style="color:rgb(187,187,170);font-style:italic">// extra {}</span>
}
</code></pre><p style="color:rgb(255,255,255);font-family:Helvetica,Arial,sans-serif;font-size:15px;background-color:rgb(51,51,51)">I see these patterns appearing very often. And these are cleanest examples I have seen so far.</p><h1 style="font-size:1.5157em;margin:30px 0px 10px;line-height:1.2;color:rgb(255,255,255);font-family:Helvetica,Arial,sans-serif;background-color:rgb(51,51,51)">Proposal</h1><h2 style="margin:30px 0px 10px;line-height:1.2;font-size:1.3195em;color:rgb(255,255,255);font-family:Helvetica,Arial,sans-serif;background-color:rgb(51,51,51)">Optional spreading</h2><h3 style="margin:30px 0px 10px;line-height:1.2;font-size:1.1487em;color:rgb(255,255,255);font-family:Helvetica,Arial,sans-serif;background-color:rgb(51,51,51)">With condition</h3><pre style="overflow:auto;font-family:Consolas,Menlo,Monaco,"Lucida Console","Liberation Mono","DejaVu Sans Mono","Bitstream Vera Sans Mono","Courier New",monospace;font-size:15px;color:rgb(255,255,255);background-color:rgb(51,51,51)"><code class="m_-472946250027792104m_3881212086764909428gmail-lang-javascript m_-472946250027792104m_3881212086764909428gmail-hljs" style="font-family:Consolas,Menlo,Monaco,"Lucida Console","Liberation Mono","DejaVu Sans Mono","Bitstream Vera Sans Mono","Courier New",monospace;font-size:1em;overflow:auto;display:block;padding:0.5em;color:rgb(248,248,248);background-image:initial;background-position:initial;background-size:initial;background-repeat:initial;background-origin:initial;background-clip:initial;max-height:500px"><span class="m_-472946250027792104m_3881212086764909428gmail-hljs-comment" style="color:rgb(187,187,170);font-style:italic">// Arrays</span>
[
  <span class="m_-472946250027792104m_3881212086764909428gmail-hljs-number" style="color:rgb(170,255,255)">1</span>,
  ?...(condition && [<span class="m_-472946250027792104m_3881212086764909428gmail-hljs-number" style="color:rgb(170,255,255)">2</span>, <span class="m_-472946250027792104m_3881212086764909428gmail-hljs-number" style="color:rgb(170,255,255)">3</span>]), <span class="m_-472946250027792104m_3881212086764909428gmail-hljs-comment" style="color:rgb(187,187,170);font-style:italic">// no extras:)</span>
  <span class="m_-472946250027792104m_3881212086764909428gmail-hljs-number" style="color:rgb(170,255,255)">3</span>,
]
<span class="m_-472946250027792104m_3881212086764909428gmail-hljs-comment" style="color:rgb(187,187,170);font-style:italic">// Objects</span>
{
  ?...(condition && { <span class="m_-472946250027792104m_3881212086764909428gmail-hljs-attr">foo</span>: <span class="m_-472946250027792104m_3881212086764909428gmail-hljs-string" style="color:rgb(255,153,153)">'bar'</span> }) <span class="m_-472946250027792104m_3881212086764909428gmail-hljs-comment" style="color:rgb(187,187,170);font-style:italic">// no extras:)</span>
}
</code></pre><h3 style="margin:30px 0px 10px;line-height:1.2;font-size:1.1487em;color:rgb(255,255,255);font-family:Helvetica,Arial,sans-serif;background-color:rgb(51,51,51)">When condition is the object</h3><pre style="overflow:auto;font-family:Consolas,Menlo,Monaco,"Lucida Console","Liberation Mono","DejaVu Sans Mono","Bitstream Vera Sans Mono","Courier New",monospace;font-size:15px;color:rgb(255,255,255);background-color:rgb(51,51,51)"><code class="m_-472946250027792104m_3881212086764909428gmail-lang-javascript m_-472946250027792104m_3881212086764909428gmail-hljs" style="font-family:Consolas,Menlo,Monaco,"Lucida Console","Liberation Mono","DejaVu Sans Mono","Bitstream Vera Sans Mono","Courier New",monospace;font-size:1em;overflow:auto;display:block;padding:0.5em;color:rgb(248,248,248);background-image:initial;background-position:initial;background-size:initial;background-repeat:initial;background-origin:initial;background-clip:initial;max-height:500px">[
  item1,
  item2,
  ?...itemsOrNull <span class="m_-472946250027792104m_3881212086764909428gmail-hljs-comment" style="color:rgb(187,187,170);font-style:italic">// no extras at all:) even (...)</span>
]
</code></pre><p style="color:rgb(255,255,255);font-family:Helvetica,Arial,sans-serif;font-size:15px;background-color:rgb(51,51,51)">These look nicer and can be good for performance since (<code style="font-family:Consolas,Menlo,Monaco,"Lucida Console","Liberation Mono","DejaVu Sans Mono","Bitstream Vera Sans Mono","Courier New",monospace;font-size:1em;color:rgb(248,248,248);background-image:initial;background-position:initial;background-size:initial;background-repeat:initial;background-origin:initial;background-clip:initial">?...</code>), since no cleanup is needed after to remove falsy values or extra spreading even when it is not needed.</p><p style="color:rgb(255,255,255);font-family:Helvetica,Arial,sans-serif;font-size:15px;background-color:rgb(51,51,51)">Looks intuitive (since: <a href="https://github.com/tc39/proposal-optional-chaining" rel="nofollow noopener noreferrer noreferrer" style="background:transparent;color:rgb(253,164,76);text-decoration-line:none" target="_blank">https://github.com/tc39/proposal-optional-chaining</a>)<br>Plays nice with typeings.</p><p style="color:rgb(255,255,255);font-family:Helvetica,Arial,sans-serif;font-size:15px;background-color:rgb(51,51,51)">What do you think? <a href="https://es.discourse.group/t/optional-spreading/93" style="background-color:rgb(255,255,255);font-family:Arial,Helvetica,sans-serif;font-size:small" rel="noreferrer noreferrer" target="_blank">https://es.discourse.group/t/optional-spreading/93</a><span style="background-color:rgb(255,255,255);font-family:Arial,Helvetica,sans-serif;font-size:small;color:rgb(34,34,34)">  </span></p></div></div>
_______________________________________________<br>
es-discuss mailing list<br>
<a href="mailto:es-discuss@mozilla.org" rel="noreferrer noreferrer" target="_blank">es-discuss@mozilla.org</a><br>
<a href="https://mail.mozilla.org/listinfo/es-discuss" rel="noreferrer noreferrer noreferrer" target="_blank">https://mail.mozilla.org/listinfo/es-discuss</a><br>
</blockquote></div></div></div>
</blockquote></div></div>