<html><body bgcolor="#FFFFFF"><div><br><br>On Jun 6, 2011, at 9:48 AM, Brendan Eich <<a href="mailto:brendan@mozilla.com">brendan@mozilla.com</a>> wrote:<br><br></div><div></div><blockquote type="cite"><div><div><div>On Jun 6, 2011, at 9:38 AM, Kam Kasravi wrote:</div><br class="Apple-interchange-newline"><blockquote type="cite"><div bgcolor="#FFFFFF"><div>I see, the object's prototype is to the left of <| and the actual object is to the right. I guess that was made clear in the proposal though I suspect others will invert the relationship since javascript programmers are used to defining the prototype after defining the object.</div></div></blockquote><div><br></div>"... after defining the constructor", you mean? Because with object initialisers that preset __proto__, programmers definitely create prototype before delegating object.</div></div></blockquote><div><br></div>Yes agreed, though most frameworks I've used do not muck with __proto__ in a declarative way, rather they do the more imperative style of FunctionDeclaration followed by the prototype. This is because most only ever see __proto__ referenced on Mozilla pages, do not know the extent of cross browser support for __proto__, and probably figured that <div><div><span class="Apple-style-span" style="font-family: 'Lucida Grande', Verdana, Lucida, Helvetica, Arial, sans-serif; -webkit-tap-highlight-color: rgba(26, 26, 26, 0.296875); -webkit-composition-fill-color: rgba(175, 192, 227, 0.230469); -webkit-composition-frame-color: rgba(77, 128, 180, 0.230469); font-size: 13px; "><pre class="code javascript" style="font-size: 12px; padding-top: 0.5em; padding-right: 0.5em; padding-bottom: 0.5em; padding-left: 0.5em; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: dashed; border-right-style: dashed; border-bottom-style: dashed; border-left-style: dashed; border-top-color: rgb(140, 172, 187); border-right-color: rgb(140, 172, 187); border-bottom-color: rgb(140, 172, 187); border-left-color: rgb(140, 172, 187); color: black; background-color: rgb(247, 249, 250); overflow-x: auto; overflow-y: auto; "><span class="kw2" style="color: rgb(0, 0, 0); font-weight: bold; ">var</span>  o = <span class="br0" style="color: rgb(102, 204, 102); ">{</span>
       __proto__ : myProto,
       a:<span class="nu0" style="color: rgb(204, 102, 204); ">0</span>,
       b: <span class="kw2" style="color: rgb(0, 0, 0); font-weight: bold; ">function</span> <span class="br0" style="color: rgb(102, 204, 102); ">(</span><span class="br0" style="color: rgb(102, 204, 102); ">)</span> <span class="br0" style="color: rgb(102, 204, 102); ">{</span><span class="br0" style="color: rgb(102, 204, 102); ">}</span>
  <span class="br0" style="color: rgb(102, 204, 102); ">}</span></pre></span>was equivalent to </div><span class="Apple-style-span" style="-webkit-tap-highlight-color: rgba(26, 26, 26, 0.292969); -webkit-composition-fill-color: rgba(175, 192, 227, 0.230469); -webkit-composition-frame-color: rgba(77, 128, 180, 0.230469); font-size: 15px; font-family: 'Lucida Grande', Verdana, Lucida, Helvetica, Arial, sans-serif; "><pre class="code javascript" style="font-size: 12px; padding-top: 0.5em; padding-right: 0.5em; padding-bottom: 0.5em; padding-left: 0.5em; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: dashed; border-right-style: dashed; border-bottom-style: dashed; border-left-style: dashed; border-top-color: rgb(140, 172, 187); border-right-color: rgb(140, 172, 187); border-bottom-color: rgb(140, 172, 187); border-left-color: rgb(140, 172, 187); color: black; background-color: rgb(247, 249, 250); overflow-x: auto; overflow-y: auto; "><span class="kw2" style="color: rgb(0, 0, 0); font-weight: bold; ">var</span>  o = <span class="br0" style="color: rgb(102, 204, 102); ">{</span>
       prototype : myProto,
       a:<span class="nu0" style="color: rgb(204, 102, 204); ">0</span>,
       b: <span class="kw2" style="color: rgb(0, 0, 0); font-weight: bold; ">function</span> <span class="br0" style="color: rgb(102, 204, 102); ">(</span><span class="br0" style="color: rgb(102, 204, 102); ">)</span> <span class="br0" style="color: rgb(102, 204, 102); ">{</span><span class="br0" style="color: rgb(102, 204, 102); ">}</span>
  <span class="br0" style="color: rgb(102, 204, 102); ">}</span></pre></span><div><span class="Apple-style-span" style="-webkit-tap-highlight-color: rgba(26, 26, 26, 0.292969); -webkit-composition-fill-color: rgba(175, 192, 227, 0.230469); -webkit-composition-frame-color: rgba(77, 128, 180, 0.230469);">Tried it and were burned by it. </span></div><div><span class="Apple-style-span" style="-webkit-tap-highlight-color: rgba(26, 26, 26, 0.292969); -webkit-composition-fill-color: rgba(175, 192, 227, 0.230469); -webkit-composition-frame-color: rgba(77, 128, 180, 0.230469);"><br></span><blockquote type="cite"><div><div><blockquote type="cite"><div bgcolor="#FFFFFF"><div>The <| operator seems like you're piping something into a target rather than the other way around, you know like the shell < operator. Thanks for the clarifications.<br></div></div></blockquote><div><br></div>The exact syntax is still being fine-tuned and perhaps even debated.</div><div><br></div><div>/be</div><div><br></div><div><br><blockquote type="cite"><div bgcolor="#FFFFFF"><div><br>On Jun 6, 2011, at 7:57 AM, Allen Wirfs-Brock <<a href="mailto:allen@wirfs-brock.com"><a href="mailto:allen@wirfs-brock.com">allen@wirfs-brock.com</a></a>> wrote:<br><br></div><div></div><blockquote type="cite"><div><br><div><div>On Jun 6, 2011, at 2:31 AM, Kam Kasravi wrote:</div><br class="Apple-interchange-newline"><blockquote type="cite"><div bgcolor="#FFFFFF">In the object literals proposal the following 2 examples are given below:<span class="Apple-style-span" style="-webkit-tap-highlight-color: rgba(26, 26, 26, 0.292969); -webkit-composition-fill-color: rgba(175, 192, 227, 0.230469); -webkit-composition-frame-color: rgba(77, 128, 180, 0.230469); font-size: 15px; font-family: 'Lucida Grande', Verdana, Lucida, Helvetica, Arial, sans-serif; "><pre class="code javascript" style="font-size: 12px; padding-top: 0.5em; padding-right: 0.5em; padding-bottom: 0.5em; padding-left: 0.5em; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: dashed; border-right-style: dashed; border-bottom-style: dashed; border-left-style: dashed; border-top-color: rgb(140, 172, 187); border-right-color: rgb(140, 172, 187); border-bottom-color: rgb(140, 172, 187); border-left-color: rgb(140, 172, 187); color: black; background-color: rgb(247, 249, 250); overflow-x: auto; overflow-y: auto; "><span class="kw2" style="color: rgb(0, 0, 0); font-weight: bold; ">var</span> enhancedArrayProto = Array.<span class="me1">prototype</span> <| <span class="br0" style="color: rgb(102, 204, 102); ">{</span>
      <span class="kw1" style="color: rgb(177, 177, 0); ">do</span> <span class="br0" style="color: rgb(102, 204, 102); ">(</span>func<span class="br0" style="color: rgb(102, 204, 102); ">)</span> <span class="br0" style="color: rgb(102, 204, 102); ">{</span><span class="kw1" style="color: rgb(177, 177, 0); ">return</span> <span class="kw1" style="color: rgb(177, 177, 0); ">this</span>.<span class="me1">foreach</span><span class="br0" style="color: rgb(102, 204, 102); ">(</span>func<span class="br0" style="color: rgb(102, 204, 102); ">)</span><span class="br0" style="color: rgb(102, 204, 102); ">}</span>,
      search <span class="br0" style="color: rgb(102, 204, 102); ">(</span>key <span class="br0" style="color: rgb(102, 204, 102); ">{</span><span class="kw1" style="color: rgb(177, 177, 0); ">return</span> <span class="kw1" style="color: rgb(177, 177, 0); ">this</span>.<span class="me1">indexOf</span><span class="br0" style="color: rgb(102, 204, 102); ">(</span>key<span class="br0" style="color: rgb(102, 204, 102); ">)</span> >= <span class="nu0" style="color: rgb(204, 102, 204); ">0</span><span class="br0" style="color: rgb(102, 204, 102); ">}</span>
  <span class="br0" style="color: rgb(102, 204, 102); ">}</span>;
  <span class="kw2" style="color: rgb(0, 0, 0); font-weight: bold; ">var</span> myArray = enhancedArrayProto <| <span class="br0" style="color: rgb(102, 204, 102); ">[</span><span class="nu0" style="color: rgb(204, 102, 204); ">0</span>,<span class="nu0" style="color: rgb(204, 102, 204); ">1</span>,<span class="nu0" style="color: rgb(204, 102, 204); ">2</span>,<span class="nu0" style="color: rgb(204, 102, 204); ">3</span>,<span class="nu0" style="color: rgb(204, 102, 204); ">4</span>,<span class="nu0" style="color: rgb(204, 102, 204); ">5</span><span class="br0" style="color: rgb(102, 204, 102); ">]</span>;</pre></span><div>1. I believe search is missing a ')'</div></div></blockquote>yes<br><blockquote type="cite"><div bgcolor="#FFFFFF"><div>2. The first example is adding another prototype to Array.prototype, eg Array.prototype.prototype that contains do and search. Since this appends to the proto chain is it correct to say it's not possible to override methods using this operator? That is it's effect should<span class="Apple-style-span" style="-webkit-tap-highlight-color: rgba(26, 26, 26, 0.292969); -webkit-composition-fill-color: rgba(175, 192, 227, 0.230469); -webkit-composition-frame-color: rgba(77, 128, 180, 0.230469); "> only be additive?</span></div></div></blockquote><div><br></div><div>It is creating a new object whose [[Prototype]] is Array.prototype. If this new object is used as a prototype it will provide all of the inherited Array.prototype methods plus do and search.  The new object could over-ride properties defined by Array.prototype but in this example it does not.</div><blockquote type="cite"><div bgcolor="#FFFFFF"><div>3. Since the <| operator accepts an ObjectLiteral would it be extended to include classes?</div></div></blockquote><div><br></div><div>Yet to be determined. Whether it is useful/meaningful will depends upon how constructor inheritance is defined via the class declaration.</div><div><br></div><div><br></div><br><blockquote type="cite"><div bgcolor="#FFFFFF"><span class="Apple-style-span" style="-webkit-tap-highlight-color: rgba(26, 26, 26, 0.292969); -webkit-composition-fill-color: rgba(175, 192, 227, 0.230469); -webkit-composition-frame-color: rgba(77, 128, 180, 0.230469); font-size: 15px; font-family: 'Lucida Grande', Verdana, Lucida, Helvetica, Arial, sans-serif; "><pre class="code javascript" style="font-size: 12px; padding-top: 0.5em; padding-right: 0.5em; padding-bottom: 0.5em; padding-left: 0.5em; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: dashed; border-right-style: dashed; border-bottom-style: dashed; border-left-style: dashed; border-top-color: rgb(140, 172, 187); border-right-color: rgb(140, 172, 187); border-bottom-color: rgb(140, 172, 187); border-left-color: rgb(140, 172, 187); color: black; background-color: rgb(247, 249, 250); overflow-x: auto; overflow-y: auto; ">  <span class="kw2" style="color: rgb(0, 0, 0); font-weight: bold; ">var</span> enhancedArrayProto = Array.<span class="me1">prototype</span> <|<font class="Apple-style-span" color="#66CC66"> class {</font>
      public <span class="kw1" style="color: rgb(177, 177, 0); ">do</span> <span class="br0" style="color: rgb(102, 204, 102); ">(</span>func<span class="br0" style="color: rgb(102, 204, 102); ">)</span> <span class="br0" style="color: rgb(102, 204, 102); ">{</span><span class="kw1" style="color: rgb(177, 177, 0); ">return</span> <span class="kw1" style="color: rgb(177, 177, 0); ">this</span>.<span class="me1">foreach</span><span class="br0" style="color: rgb(102, 204, 102); ">(</span>func<span class="br0" style="color: rgb(102, 204, 102); ">)</span><span class="br0" style="color: rgb(102, 204, 102); ">}</span>
      public search <span class="br0" style="color: rgb(102, 204, 102); ">(</span>key) <span class="br0" style="color: rgb(102, 204, 102); ">{</span><span class="kw1" style="color: rgb(177, 177, 0); ">return</span> <span class="kw1" style="color: rgb(177, 177, 0); ">this</span>.<span class="me1">indexOf</span><span class="br0" style="color: rgb(102, 204, 102); ">(</span>key<span class="br0" style="color: rgb(102, 204, 102); ">)</span> >= <span class="nu0" style="color: rgb(204, 102, 204); ">0</span><span class="br0" style="color: rgb(102, 204, 102); ">}</span>
  <span class="br0" style="color: rgb(102, 204, 102); ">}</span>;</pre></span><div>4. I'm not quite clear on what the myArray example does, is it adding a new prototype that provides initialization of some kind?<span class="Apple-style-span" style="-webkit-tap-highlight-color: rgba(26, 26, 26, 0.292969); -webkit-composition-fill-color: rgba(175, 192, 227, 0.230469); -webkit-composition-frame-color: rgba(77, 128, 180, 0.230469); font-size: 15px; font-family: monospace; white-space: pre; ">  </span></div></div></blockquote><div><br></div><div>It is just creating a new array object whose immediate [[Prototype]] is enhancedArrayProto.  The new object has all all of the special array functionality. </div><div><br></div><div>Allen</div></div></div></blockquote></div>_______________________________________________<br>es-discuss mailing list<br><a href="mailto:es-discuss@mozilla.org"><a href="mailto:es-discuss@mozilla.org">es-discuss@mozilla.org</a></a><br><a href="https://mail.mozilla.org/listinfo/es-discuss">https://mail.mozilla.org/listinfo/es-discuss</a><br></blockquote></div><br></div></blockquote></div></div></body></html>