5 ms·

That might be one of the most readable pieces of code that I've ever read.

jm547ster 8y ago
Really? Plenty of needlessly abbreviated function names IMO. At a quick glance is it immediately obvious what posf or arem are without looking into the context in which they're being used? Don't get me wrong it's a nice piece of code but super-readable it isn't.
- oh-kumudo 8y ago
  Well, I disagree. It is abbreviated, but since the whole file is self-contained and the definitions are put at the beginning, there is enough information to infer the function's semantics without being excessively specific. I think well defined organization of abstractions is an often overlooked but surprisingly effective way to achieve readability
  - olavk 8y ago
    > there is enough information to infer the function's semantics without being excessively specific You mean you can just read the function definition to see what it does?
    - mosselman 8y ago
      He doesn't like being excessively specific with his writing I guess. Plus it makes you sound more like an engineer when you speak like this.
vorticalbox 8y ago
Really? It has horrendous naming and it isn't even using es6 function byClass (el, cl) { return el ? el.getElementsByClassName(cl) : [] } const byClass = (el, cl) => el ? el.getElementsByClassName(cl) : []
- arnvald 8y ago
  How does es6 improve readability in this case? It barely removes `{}` and replaces very clear word `function` with `const` that in most languages is associated with constant values, not with functions
  - sashimy 8y ago
    It removes the brackets and the return keyword, const is in fact a constant but this not ES6 it is just doing a function expression instead a function declaration (you create a const variable and assign an anonymous function to it instead of using the keyword 'function') This is used for readability and to avoid hoisting that can be confusing.
    - cyphar 8y ago
      Given that brackets and the return keyword (and the function keyword!) are core parts of functions (a scope and a value to return to the caller), I would argue that removing these key parts of a function makes it harder for someone not familiar with ES6 to see that it is a function. This reminds me of Ruby's return-the-last-evaluated-thing-in-a-function semantics (which sadly Rust copied). Having to type one extra word is not such a burden that you should add cognitive overhead each time someone not intimately familiar with the language has to read your code. If the argument is that only ES6 experts should only ever have to read or write ES6 code, then I would argue that any syntax argument is pointless because only experts can comment on a languages syntax -- and thus COBOL objectively has the best syntax and you cannot disagree unless you are a COBOL expert.
      - mercer 8y ago
        > This reminds me of Ruby's return-the-last-evaluated-thing-in-a-function semantics (which sadly Rust copied). Having to type one extra word is not such a burden that you should add cognitive overhead each time someone not intimately familiar with the language has to read your code. I think the concept of returning by default is fundamental enough that doing so or not is mostly a matter of what you're used to. If I'd started out with Elixir or Ruby I'd probably find it strange that I have to manually return stuff from a function. Furthermore, at this point ES6 is common enough that knowing at least some of the core additions (among them arrow functions with their implicit return) should be something any front-ender knows.
olavk 8y ago
It seems some of the one-liners are simply renaming JavaScript built-ins like forEach to aeach and slice to acut. Maybe this is to make it look more like the Lisp backend? But taken on its own it does not really improve readability.
- gpvos 8y ago
  No, it is because some array-like objects like node lists actually aren't Arrays and don't have those functions in their prototype.
  - mercer 8y ago
    this is why I usually go for something like const $ = (el) => [...document.querySelectorAll(el)]
    - spiralx 8y ago
      Although NodeList has forEach defined on it now at least.
Vinnl 8y ago
I think the main reason this is somewhat readable is because there's hardly any code. Which is fine.
- jwally 8y ago
  The supreme art of war is to subdue the enemy without fighting. -sun tzu
  - LiterallyDoge 8y ago
    (y)
noobermin 8y ago
It's also a piece of code that hasn't been rewritten to fit whatever buzz is the buzz today. I wish more of the world was written with code that need not be rewritten every five years.

Really? Plenty of needlessly abbreviated function names IMO. At a quick glance is it immediately obvious what posf or arem are without looking into the context in which they're being used? Don't get me wrong it's a nice piece of code but super-readable it isn't.

oh-kumudo 8y ago
Well, I disagree. It is abbreviated, but since the whole file is self-contained and the definitions are put at the beginning, there is enough information to infer the function's semantics without being excessively specific. I think well defined organization of abstractions is an often overlooked but surprisingly effective way to achieve readability
- olavk 8y ago
  > there is enough information to infer the function's semantics without being excessively specific You mean you can just read the function definition to see what it does?
  - mosselman 8y ago
    He doesn't like being excessively specific with his writing I guess. Plus it makes you sound more like an engineer when you speak like this.

vorticalbox 8y ago

Really? It has horrendous naming and it isn't even using es6 function byClass (el, cl) { return el ? el.getElementsByClassName(cl) : [] } const byClass = (el, cl) => el ? el.getElementsByClassName(cl) : []

arnvald 8y ago
How does es6 improve readability in this case? It barely removes `{}` and replaces very clear word `function` with `const` that in most languages is associated with constant values, not with functions
- sashimy 8y ago
  It removes the brackets and the return keyword, const is in fact a constant but this not ES6 it is just doing a function expression instead a function declaration (you create a const variable and assign an anonymous function to it instead of using the keyword 'function') This is used for readability and to avoid hoisting that can be confusing.
  - cyphar 8y ago
    Given that brackets and the return keyword (and the function keyword!) are core parts of functions (a scope and a value to return to the caller), I would argue that removing these key parts of a function makes it harder for someone not familiar with ES6 to see that it is a function. This reminds me of Ruby's return-the-last-evaluated-thing-in-a-function semantics (which sadly Rust copied). Having to type one extra word is not such a burden that you should add cognitive overhead each time someone not intimately familiar with the language has to read your code. If the argument is that only ES6 experts should only ever have to read or write ES6 code, then I would argue that any syntax argument is pointless because only experts can comment on a languages syntax -- and thus COBOL objectively has the best syntax and you cannot disagree unless you are a COBOL expert.
    - mercer 8y ago
      > This reminds me of Ruby's return-the-last-evaluated-thing-in-a-function semantics (which sadly Rust copied). Having to type one extra word is not such a burden that you should add cognitive overhead each time someone not intimately familiar with the language has to read your code. I think the concept of returning by default is fundamental enough that doing so or not is mostly a matter of what you're used to. If I'd started out with Elixir or Ruby I'd probably find it strange that I have to manually return stuff from a function. Furthermore, at this point ES6 is common enough that knowing at least some of the core additions (among them arrow functions with their implicit return) should be something any front-ender knows.

olavk 8y ago

It seems some of the one-liners are simply renaming JavaScript built-ins like forEach to aeach and slice to acut. Maybe this is to make it look more like the Lisp backend? But taken on its own it does not really improve readability.

gpvos 8y ago
No, it is because some array-like objects like node lists actually aren't Arrays and don't have those functions in their prototype.
- mercer 8y ago
  this is why I usually go for something like const $ = (el) => [...document.querySelectorAll(el)]
  - spiralx 8y ago
    Although NodeList has forEach defined on it now at least.

Vinnl 8y ago

I think the main reason this is somewhat readable is because there's hardly any code. Which is fine.

jwally 8y ago
The supreme art of war is to subdue the enemy without fighting. -sun tzu
- LiterallyDoge 8y ago
  (y)

noobermin 8y ago

It's also a piece of code that hasn't been rewritten to fit whatever buzz is the buzz today. I wish more of the world was written with code that need not be rewritten every five years.