Cheatsheet for the modern JavaScript | Hacker News Reader

Cheatsheet for the modern JavaScript

github.com

288 pointsshridhad31 comments

This is probably a fine resource. Can't really judge it - I avoid JavaScript to the extend humanly possible.

But please - could someone end the devaluation of the word cheatsheet. A cheatsheet should be just that - a sheet of paper or its digital equivalent, with a few short, clear notes of essentials. Not a rambling document. Not something with a table of contents.

Agree. I was expecting something that one could print on maximum two A4 pages. This here is a rather long pamphlet.

Thank you. For comparison, these are real cheatsheets:

* https://zeroturnaround.com/wp-content/uploads/2017/03/regex-...

* https://rumorscity.com/wp-content/uploads/2014/08/10-Best-VI...

* https://wch.github.io/latexsheet/latexsheet-1.png

Thanks for the cheatsheet examples. They bring back fond memories of the laminated cheatsheets I used to buy at the bookstore. But it's been a long time since I used one of those; now I just want everything in digital form to keep my backpack light.

It was interesting that these are all bitmap image files at a rather low resolution. The text is so blurry on all of them! It made me wonder: do people actually use these kinds of image cheatsheets? They wouldn't print well, and zooming in on screen just gives blurry text. My old laminated sheets had crisp high-quality printed text.

It would be different if they were in a vector format, of course. But since I'm not printing them anyway, the traditional cheatsheet is no longer a useful format for me. I much prefer a short document like the OP's "cheatsheet" with legible text that I can scroll through on any device without having to zoom in and pan around.

I suppose one could object to the "sheet" part, since you can't print a document like this on a single sheet of letter or A4 paper. But that doesn't bother me at all: I started my programming career on Teletype machines that used roll paper, and we routinely printed out cheatsheets of varying length. There was no set height to a sheet: it ended wherever you tore it off the roll.

What would be a better name for a document like this that serves the purpose of a traditional cheatsheet but is in a format more suited for digital reading? Maybe "A short guide to ..."?

(Updated with more stories)

Summary? Overview?

Judging by the downvotes, I think that post was misinterpreted. I was suggesting that the word "cheatsheet" could be replaced by "summary" or "overview".

E.g. "An overview of modern JavaScript" or "Modern JavaScript - Executive Summary"

Why are you being downvoted for this?

AFAICT these are low-res previews of high-quality PDF cheat sheets you can buy.

I think people downvoted version 1 of my comment, which was less interesting and more cranky. But the downvotes were helpful; they gave me an excuse to make it more friendly and add a relevant story. :-)

I should have guessed that these were just low-res previews: I read too much into the comment that they were real cheatsheets.

Even with high-quality vector text, though, I wouldn't find them useful because of the layout. It's great if you print them, but if you like to have everything onscreen, a scrolling document is easier to read.

High res versions:

Regex: https://i.imgur.com/f47LvfU.png

Vim: https://i.imgur.com/YLInLlY.png

Latex: no hi res version but PDF + 2nd page! here

https://wch.github.io/latexsheet/

High res versions:

Regex: https://i.imgur.com/f47LvfU.png

Vim: https://i.imgur.com/YLInLlY.png

Latex: no hi res version but PDF + 2nd page! here

https://wch.github.io/latexsheet/

Thanks but due to imgur’s recent update these are even lower resolution than the quick finds in my original post (on mobile). I’ll post full-size links when I get to a PC.

For ES6, I really like this one: http://es6-features.org/ Not a cheatsheet per-se (nor sold as one), but at least they keep it mostly on one page, it's closer to a cheatsheet and better than a long document.

Very helpful and great explanations. To me Airbnb's JS styleguide was also very helpful, which showcases best practices and lots of examples. https://github.com/airbnb/javascript

I've also found the BabelJS "Learn ES2015" page valuable as a cheat sheet and usually have it open while working with ES2015+: https://babeljs.io/learn-es2015/

I usually just do just enough javascript, but didn't know the difference between let and var, not it makes sense. the explanation of reduce made sense too.

I always use `const` unless i can't otherwise `let`. There is no place for `var` although everyone has an opinion this has always worked for me.

`let` is block scoped, while `var` is function scoped.

Essentially:

    function do_something() {
      if (true) {
        var x = 42;
        let y = 42;
      }
      console.log(x); // 42
      console.log(y); // Reference error: y is not defined
    }

It's extremely useful in for loops:

    for (var i = 0; i < 5; i++) {
      setTimeout(function () { console.log(i); }); // => 5, 5, 5, 5, 5
    }

    for (let i = 0; i < 5; i++) {
      setTimeout(function () { console.log(i); }); // => 0, 1, 2, 3, 4
    }

that makes a lot of sense, I used to just make a brand new unique variable for loops

Handy resource -- but like somebody else commented, probably better called a summary of modern JavaScript than a cheatsheet.

Rules for this in JS from top to bottom in priority:

1. The function was called with 'new'

2. The function was called with 'call' or 'apply' specifying an explicit this

3. The function was called via a containing/owning object (context)

4. DEFAUL: global object (expect strict mode--undefined)

You missed out Function.prototype.bind

tnx

Nicely done.

Reply on news.ycombinator.com