• blabla (unregistered)

    Sorted by frist.

  • (nodebb)

    I do the same thing, when I leave an empty box/ package in the fridge, it gets removed from the fridge somehow.

  • Me (unregistered)

    I don't know JavaScript. Please don't tell me there's a built-in function for this.

  • P (unregistered)

    Once we've built that array, we can sort it. Fortunately for us, when you sort a 2D array, JavaScript helpfully defaults to sorting by the first element in the second dimension, so this will sort by the text value.

    What? No. Did TR(Remy)WTF not even bother to read the docs before writing his TDWTF articles again?

    https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort

    The sort() method sorts the elements of an array in place and returns the sorted array. The default sort order is ascending, built upon converting the elements into strings, then comparing their sequences of UTF-16 code units values.

  • P (unregistered)

    Also the code loop infinitely at the while statement unless the options array is empty. Remy even got this wrong too.

    The write-up of this piece is even more of a WTF than the WTF itself, to be honest.

  • (author) in reply to P

    This is not true. Admittedly, I didn't check the docs, I just tested the bits I was curious about. And to my surprise, the while loop works on an array that is non-empty. At least in Firefox, anyway.

  • Ltrlg (unregistered)

    That would not work on an array, but selElem.options is a HTMLOptionsCollection, which does have this behavior (https://html.spec.whatwg.org/multipage/common-dom-interfaces.html#dom-htmloptionscollection-setter). Using DOM brings many ways to be confused about how JavaScript works…

  • my name is missing (unregistered)

    I worked with a Java dev who called himself The Java God. First rule of working: never work with anyone who describes themselves as a God. In this case too he was more of a Clod.

  • Robin (unregistered)

    I am a JS developer myself, and I thought "this is bullshit" during the explanation - but refrained from saying so because I'm not insane enough to ever have tried a loop like that. Indeed, though, [null].length gives the expected answer of 1, so that loop is indeed infinite. This was tested in Chrome but I'd be genuinely shocked if any recent version of Firefox was different.

    As for the sorting, I haven't checked but I think this probably does work - but not in the way you expect. When the sortmethod is used with no argument, JS defaults to coercing each element to a string and sorting lexicographically (which yes is a WTF in itself, I like JS a lot more than I think most readers here but that doesn't mean I'm blind to its faults). And for arrays that means converting each element to a string then joining with commas. So it will indeed sort by the first element, at least if those are already strings - but this isn't a general rule.

  • Scott (unregistered)

    I'm wondering why sorting is being done on the client. This seems like an html select's options, the values for which presumably come from a table in a data store somewhere?

    Why not sort that list on the server, and deliver it to the client ready to be bound? If that needs to be sorted in various ways, pass along a parameter(s).

  • (nodebb) in reply to Robin

    [null].length is an invalid analogy to the code in question. First, it uses an array initializer syntax and not index assignment to an existing array. Second, I'm pretty sure the options property returns some kind of HTMLCollection, not an array. Man with javascript developers like you, no wonder this site exists.

  • (nodebb) in reply to Ltrlg

    I posted a comment saying the same before seeing your comment. You're absolutely correct. People, please don't criticize Remy when you're not qualified to do so. I've seen a few cases of invalid criticism recently.

  • (nodebb) in reply to Scott

    That may be a reasonable approach. If the # of items is low, as it probably is in a select element, and the UI allows the user to change the sorting, it'd be overkill to do a server trip. Your concern is very justified with tables/ lists showing paged results from a data store with many rows, but not as much with a dropdown.

  • (nodebb)

    Well, I tried it in Firefox: picked a random page off somewhere with a <select> element, copied the function in the article into the console and threw the select element at it.

    No infinite loop, and it did sort the element's options. It also moved the empty text nodes in between to the front. (And, because of that coercion business, foo, sorts before foo.)

  • (nodebb) in reply to P

    I think what happened is that Remy tested the behavior but arrived at a logically sound, but an incorrect root cause for it. Cut the man some slack. Nobody remembers all the idiosyncrasies of all languages and frameworks. I for one didn't know the sort method behavior of doing a to string of each item before comparing.

  • P (unregistered) in reply to Mr. TA

    That's a atrocious excuse of avoiding addressing the issue that Remy did posted an article with little research, or understanding of what's actually going on. Since when has TDWTF daily articles become lazy like this?

    And how fun! Now the explanation is delegated to the Featured Comments again. Since the recent 1-2 years Featured Comments has basically become synonymous to "Remy/Alex didn't do their research properly have to rely on pinning other's reactions and explanations in Featured Comments to cover up their incompetence". We might as well just let Remy and Alex post nothing but the code without any explanation, and let the viewers fill in the gaps. Or as they say, "crowd-sourcing TDWTF articles".

  • Robin (unregistered) in reply to Mr. TA

    Apologies, I wasn't trying to have a go. And I admit it hadn't occurred to me that the "array" here might be an HTML collection and therefore behave differently. (yes, that's another WTF...)

    I still think [null].length is exactly the right thing to check, because it's exactly what would result from this code and be tested to see if the loop continued. The description given is misleading and innacurate - and hopefully Remy will correct it, and in pointing this out I didn't mean to cause offence, although I admit my poorly chosen language may have done so. I love the site, and more for the commentaries than just the raw bad code.

  • Anon (unregistered)

    Another WTF that work most of the time, most.

    alert([['Wilson', 2], ['Wilson, Slade', 3]].sort().toString());

  • Selected Comment (unregistered) in reply to Mr. TA

    I think what happened is that Remy tested the behavior but arrived at a logically sound, but an incorrect root cause for it.

    Maybe so, but it's still wrong, and trying to run that code on an array will loop forever because JS arrays don't do what he said in the article. So at a minimum it shows he didn't actually test what he wrote. One of many WTFs in this area is the DOM 'array-like' objects which act kind of like arrays, but not really - presumably the original code got started because you can't call Array.sort on them, for example, and while you can index them and for loop them, you can't use .map and the like on them.

    To be honest the original isn't that WTFy given the environment - copying the values into an actual array, sorting them and then updating the DOM collection may well be the right answer, as sort functions won't work on the collection directly.

  • (nodebb) in reply to P

    Define "little" research. As he said, he tested the code. Yes he came to an incorrect conclusion, so one mistake, and now you got your panties in a bunch.

    Secondly, why is them pinning informative comments a bad thing? It shows integrity to be able to admit a correction by highlighting it. What should they have done instead, deleted the comment which clarifies the article and banned the commenter?

  • (nodebb) in reply to Robin

    The code makes it very clear that the loop operates on options property of a select element. I didn't for a second think it was an array. The article describes it precisely, as well:

    "This code sorts the elements in a drop down list, and it manages to do this in a… unique way.

    First, we iterate across the elements in the list of options."

    Knowing that it's not an array, which you should've, offering [null].length as an analogous expression is flat out wrong.

    Lastly, please don't take my comments personally either. Rather, it should be a learning experience for all involved.

  • (nodebb) in reply to Selected Comment

    You are mixing up two subjects here.

    The part of my comment that you quoted refers to how Array.sort() works, not the loop. Remy made absolutely no mistakes regarding the loop emptying HTMLOptionCollection by setting items to null. Whether the approach of "empty something by looping to set items to null" works on an Array, or not, is completely irrelevant.

    On the Array.sort() he was mistaken about why it works, but not that it works. Everybody makes mistakes and let the first person who is a perfect human being cast the first stone. What we should not do is criticize anybody unfairly. The easiest way to make somebody not absorb fair criticism is inundating him with unfair criticism.

  • (nodebb) in reply to Selected Comment

    You are mixing up two subjects here.

    The part of my comment that you quoted refers to how Array.sort() works, not the loop. Remy made absolutely no mistakes regarding the loop emptying HTMLOptionCollection by setting items to null. Whether the approach of "empty something by looping to set items to null" works on an Array, or not, is completely irrelevant.

    On the Array.sort() he was mistaken about why it works, but not that it works. Everybody makes mistakes and let the first person who is a perfect human being cast the first stone. What we should not do is criticize anybody unfairly. The easiest way to make somebody not absorb fair criticism is inundating him with unfair criticism.

  • Álvaro González (github) in reply to Me

    I don't know JavaScript. Please don't tell me there's a built-in function for this.

    There is... for arrays. An HTMLCollection isn't an array.

  • Peter of the Norse (unregistered)

    Could someone with experience with JavaScript tell me how you would do this? Because there is no sort() on HTMLOptionsCollection, so you do need to build an array. Yes, that while loop and creating a new Option for every element is unnecessary, but you still have two loops to copy values into and out of the array.

  • tbo (unregistered) in reply to Mr. TA

    I'm trying to reconcile this comment:

    "Lastly, please don't take my comments personally either."

    with this one:

    "Man with javascript developers like you, no wonder this site exists."

    while this shows up in the middle:

    "I for one didn't know the sort method behavior of doing a to string of each item before comparing."

  • (nodebb)

    Is it just me, or are the comments a ton more angry and abusive on Mondays?

  • (nodebb) in reply to P

    I think it'd be great fun to crowd source the article text from the source code. Remy could just provide one sentence like "At Initech, "name" took over from "other name" and found this gem:"

    Oh...Yeah, and I am self-described as a God too (of the Gen Con Auction).

  • Truism (unregistered)

    TRWTF today: The comment section.

  • SyntaxError (unregistered)

    It sounds like some of the people here are putting Remy up on a pedestal (like some sort of God/Idol), only to tear him down. Expecting perfection from a human is nonsense. He is a human just like the rest of us, prone to mistakes. For those roasting him, you're making more of a big deal out of this than it really is. Offer a correction humbly, and move on.

  • Björn Tantau (unregistered)

    So, where is the WTF? (apart from JavaScript making you think an array-like object behaves like an array)

    Yes, he could've put the store-in-temp-array loop into the delete-loop. But I think the way it's presented makes it more clear.

    You could do some micro optimisations here and there, maybe reuse the original options, but why bother? The function will do its job in the blink of an eye anyway.

    Actually, the function does make the select lose any preselected option. Honest mistake. Can't think of anything else.

  • Kaali (unregistered)

    That's the most pythonic JS code I have seen.

  • Doug (unregistered) in reply to cellocgw

    cellocgw:

    Is it just me

    It is totally just you. ALSO, I HATE YOU AND EVERYTHING YOU STAND FOR.

  • Andy F (unregistered) in reply to Álvaro González

    This is where Array.from() comes in handy.

  • mihi (unregistered)

    About the "while not empty, remove first element" loop: This is a legitimate and performant way to empty a LinkedList (in Java or other languages). In languages that use refcounting instead of garbage collection, it may even allow you to destruct a LinkedList that is too deep to be destructed normally, due to stack overflow. Of course, a HTMLOptionsCollection is not a LinkedList and you won't usually remove elements by setting them to null.

  • Donald Dumb (unregistered) in reply to Scott

    Ask China. The server is made in China.

  • Crush TDWDF (unregistered) in reply to P

    Totally agreed. How could Remy do that. This breaks what the site promises from day one to avoid crowdsourcing. And it deviates from the goal of this site to be more authentic than even the manuals and documentations. Remy and the gang has just degraded this site from this noble goal to "boo at people for failures when taking a break from work". Shame.

    /sarcasm

  • Future (unregistered) in reply to Álvaro González

    Why not? Is this not TRWTF?

  • EwgB (unregistered)

    The only thing I can say to this is "WAT?"

  • Some Ed (unregistered) in reply to tbo

    The reconciling of these sentences that you've picked from here and there is the very next sentence after the first one. "Rather, it should be a learning experience for all involved." Mr. TA is involved, and it should be a learning experience for them, too. In order to ensure that it is, they've apparently made sure to leave plenty in their comments for them to learn from.

Leave a comment on “Selected Sort”

Log In or post as a guest

Replying to comment #:

Log Out

« Return to Article