TE
TechEcho
Home24h TopNewestBestAskShowJobs
GitHubTwitter
Home

TechEcho

A tech news platform built with Next.js, providing global tech news and discussions.

GitHubTwitter

Home

HomeNewestBestAskShowJobs

Resources

HackerNews APIOriginal HackerNewsNext.js

© 2025 TechEcho. All rights reserved.

Destructuring and Recursion in ES6

115 pointsby StylifyYourBlogover 10 years ago

12 comments

eric_bullingtonover 10 years ago
Hah, I&#x27;m tempted to go through the Ocaml 99 problems (which was inspired by the Prolog version) using ES6 [1]. Turns out, with recursion and a head and tail function, you can do virtually anything with lists.<p>I hope the popular JS engines optimize the hell out of the gathering operator, and adds TCO (it&#x27;s on the ES6 spec, evidently). Then we won&#x27;t even need to cross our fingers when we describe JS as a functional language to our peers.<p>And with the increasing emphasis on immutability, as preached by the React crowd, with cross seeding from the Clojurescript-React connections, JS grows even closer to being a Scheme [2].<p>If ES7 would lock down &#x27;use strict&#x27; mode against even more of JS&#x27;s weak-typing bloopers, things would be even better yet. I don&#x27;t see why they shouldn&#x27;t. They whole reason for &#x27;use strict&#x27; is to give people who need backwards compatibility an out.<p>Incidentally, I&#x27;m also having great success using ES6 arrow functions at work, thanks to 6to5 [3]. I do a lot of d3 work, and arrow functions have made using d3, particularly the ubiquitous d3 accessor functions, so much nicer. Highly recommended.<p>For the first time since Node, I&#x27;m actually getting excited about Javascript&#x27;s prospects. Now, if only they&#x27;d add types, and sum types...<p>1. <a href="http://ocaml.org/learn/tutorials/99problems.html" rel="nofollow">http:&#x2F;&#x2F;ocaml.org&#x2F;learn&#x2F;tutorials&#x2F;99problems.html</a><p>2. No, I don&#x27;t actually believe that JS is a Scheme in disguise.<p>3. <a href="https://github.com/6to5/6to5" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;6to5&#x2F;6to5</a>
评论 #8986555 未加载
评论 #8990338 未加载
评论 #8987322 未加载
reconbotover 10 years ago
It&#x27;s hard to believe this is javascript. I write that with a lot of love. These are some of my favorite language features but It&#x27;s going to take some adjustment to be comfortable using and reading them in JS.
评论 #8985075 未加载
评论 #8988438 未加载
iMarkover 10 years ago
ES6 transpiling has been a bit of a revelation to me lately. Object destructuring is also exceedingly useful.<p>On a bit of a tangent from the article, I&#x27;m interested by the use of const as the default for variable declaration. My background is such that I&#x27;ve always considered constants as things that are class level constants (thank you Java), but reading up on Swift has made me rethink this.<p>Clearly const has the potential to reduce runtime errors. I&#x27;d appreciate it if anyone could recommend any further reading on the subject.
评论 #8985240 未加载
philsnowover 10 years ago
I&#x27;ve never liked this corner of JS, and haven&#x27;t kept up on ES6 or any of the modern dialects of JS, but it looks like `undefined` is still hanging around as a first-class thing?<p><pre><code> const length = ([first, ...rest]) =&gt; first === undefined ? 0 : 1 + length(rest); </code></pre> Having worked in languages that support multiple (destructuring or not) function definitions, this doesn&#x27;t look quite right.<p>Here&#x27;s something I typed into chrome&#x27;s JS console:<p><pre><code> &gt; [1,2,3].length 3 &gt; [undefined, 2, 3].length 3 </code></pre> Wouldn&#x27;t the above-defined ES6 `length` function return 0 for the latter array?<p>To mock up a similar syntax that would handle this more gracefully (and more sensically):<p><pre><code> const length = case ([]) =&gt; 0, ([first, ...rest]) =&gt; 1 + length(rest); </code></pre> Wouldn&#x27;t it be better in general to be able to destructure arguments using syntax? If you can&#x27;t use a case-like syntax for this, what do you do to be able to handle different structures?
评论 #8986952 未加载
评论 #8986889 未加载
peferronover 10 years ago
I&#x27;ve been pondering a few style questions recently:<p><i>1. When to use &#x27;function&#x27; vs &#x27;=&gt;&#x27;?</i><p>Leaving aside hoisting and handling of &#x27;this&#x27;, &#x27;function&#x27; and &#x27;=&gt;&#x27; are usually interchangeable:<p><pre><code> function foo(x) { &#x2F;&#x2F; do something } let foo = x =&gt; { &#x2F;&#x2F; do something } </code></pre> I prefer to keep using &#x27;function&#x27; because it&#x27;s immediately obvious to the reader that we are creating a function. With &#x27;=&gt;&#x27;, the reader doesn&#x27;t know if foo is a function or not until reaching &#x27;=&gt;&#x27;, which is located after the argument list. There&#x27;s also almost no terseness gain. A potential win for &#x27;=&gt;&#x27; though would be the ability to declare the function as &#x27;const&#x27;.<p>With closures, &#x27;=&gt;&#x27; wins because the reader already expects a function, and the terseness gain is significant:<p><pre><code> somearray.map(function(x) { &#x2F;&#x2F; do something }); somearray.map(x =&gt; { &#x2F;&#x2F; do something }); </code></pre> <i>2. When to use {} around the function body?</i><p><pre><code> somearray.forEach(x =&gt; &#x2F;* a single statement *&#x2F;); somearray.forEach(x =&gt; {&#x2F;* a single statement *&#x2F;}); </code></pre> {} around the function body are optional if there&#x27;s only a single statement. However, for clarity, I still use {} when I want to make it clear that we are not using the return value. I think that might be overkill though: the reader should aready expect that &#x27;map&#x27;, &#x27;filter&#x27; and friends will use the return value, while &#x27;forEach&#x27; will not.<p><i>3. &#x27;let&#x27; or &#x27;const&#x27;?</i><p>This one is already mentioned in a sibling comment, so let&#x27;s keep the discussion there.<p>I realize that these are tiny style decisions that will probably incite endless bikeshedding, but I&#x27;m still interested in hearing opinions from fellow HNers. :)
评论 #8986855 未加载
评论 #8989014 未加载
whichdanover 10 years ago
<p><pre><code> const description = (nameAndOccupation) =&gt; { const [[first, last], occupation] = nameAndOccupation; return `${first} is a ${occupation}`; } description([[&quot;Reginald&quot;, &quot;Braithwaite&quot;], &quot;programmer&quot;]) &#x2F;&#x2F;=&gt; &quot;Reginald is a programmer&quot; </code></pre> This is going to make code a <i>lot</i> more readable. I&#x27;m excited!
评论 #8984987 未加载
评论 #8985073 未加载
评论 #8986655 未加载
phpnodeover 10 years ago
obligatory mention that 6to5[0] lets you use all this stuff, and more, today. I&#x27;ve been using it for 3 months now and it has totally transformed the way I write JS applications, it&#x27;s awesome.<p>[0] <a href="https://6to5.org/" rel="nofollow">https:&#x2F;&#x2F;6to5.org&#x2F;</a>
janjongboomover 10 years ago
Also coming to ES6 is destructuring objects:<p><pre><code> function doSomething(aObj) { let { x, y } = aObj; } doSomething({ x: 1, y: 4 })</code></pre>
taylodlover 10 years ago
Yet another validation of Greenspun&#x27;s tenth rule. Now if only ES6 would get proper tail recursion then we&#x27;d be all set!
评论 #8985288 未加载
fenollpover 10 years ago
So basically pattern matching, shorter syntax for lambdas, string manipulation à la Ruby (but with backquotes, why?) and… confusing list with array EVERYWHERE in the language? No TCO? A `map` (sorry, `mapWith`) that creates then concatenates lists?<p>2015 sounds <i>amazing!</i>
评论 #8985977 未加载
nooberminover 10 years ago
Completely unrelated, but even assuming the author of the article posts here, are you from Columbus OH? I&#x27;ve gone to One-Line Coffee (the source of the first pic) myself a number of times!
drapperover 10 years ago
Don&#x27;t want to come off overly bitter, it&#x27;s certainly interesting, but I&#x27;d like to see some practical uses of this, besides reimplementation of map() and other &quot;low-level&quot; functions...
评论 #8985819 未加载