By the time the author writes it, it's published, and you read it, the information can be dated, sometimes extremely so.
There are gobs of online resources, and the best resource is rarely mentioned: reading other peoples code.
Once you get a basic understanding, you can start right clicking on webpages, "inspect source", opening the console window, and looking at how pages actually work. The debugger and single stepping chrome are quite good.
Also there are many books online which don't need to go through the hoops you describe.
I agree that there are many books online though, and they can provide a lot of nice things like running code samples in your browser. However, I find video tutorials to provide a better experience than books, online or not. I suppose that's just a matter of personal preference though.
That being said, there are some pretty fundamental abstract concepts behind all forms of programming that have stuck around for a long time: those old comp sci course materials. I'd recommend turning to books for some of that content, as picking up some knowledge there will support you no matter what programming language you try to learn.
Having said that it is a good idea to learn about these early and keep them in mind. Sadly there isn't a good definitive list of JS' idiosyncrasy that I know of.
If you're doing front-end work, then React and Redux (or Angular, or jQuery, or whatever.)
If you're doing Node.js, try reading through the lib/ folder of Node's source (the js code goes in lib/, the c++ goes in src/), and follow that with packages like express and request.
When you hit an interesting/confusing/etc. dependency, track it down and read it's source too.
I like the book "The Little Schemer" to learn recursion. Yes, a whole book to learn something other books briefly throw at you. You will not regret the read.
It is available for free on github so you can evaluate before buying.
I wish more authors would publish the markdown or asciidoc. I'd pay for it.
And, although the book is dated, I think it still does a good job of explaining the core concepts of the language even of today.
- Be very careful about what you read online. Blog platforms are full of script kiddies trying to feed you their misconceptions without a second thought. I generally only 'trust' two sources - Mozilla Developer Network and http://2ality.com/ by Axel Rauschmayer (I believe his books are mentioned in other answers too).
- Whenever you are faced with a particular library/technology - look from books/posts from their creators or someone associated with them.
No waiting for your code to be processed server side, or anything like that. I pick up a book later on, commonly, if I know the language and want to know more about techniques for building something specific with it.
But for learning a new language, an editor and a hello world app are where I start.
Are you looking to learn code via JS?
Are you proficient in another language that has similar constructs to JS and just need to understand the nuances?
Are you somebody who has understood JQuery on a low level but never understood what the code was actually doing?
I am sure there are a few more questions along similar veins and I think each one of these questions could be interpreted from the OP and I think all of these have potentially different answers.
Lately I just turn to intercooler, but that's not a solution for everything.
2. Then understand how to define a function (better if you do it the ES6 way, that is, using the "=>" operator), and how to call it.
3. Learn how to use lists and hashtables(dictionaries).
4. After this, learn how to use JSON objects, that is, how to access each member of a JSON object. This will be trivial after step (3).
5. Then, learn the simple logic constructs: if, for, etc. They are easy, really.
Now comes the slightly more difficult part. I'm assuming you want to try Node.js development.
6. Learn what is the Node.js "event loop". IN other words, the philosophy behind Node and why most operations are "asynchronous" in Node.js. Learn about callbacks.
7. Now learn about "Promises" and learn how to use "async" and "await" to consume Promises easily. In other words, to program using asynchronous functions with no sweat.
8. Learn "express.js" web framework. It is really easy.
And don't forget to take a look to the ES6 and ES7 features and make sure you take advantage of them:
If you want to learn concepts, You Don't Know JS by Kyle Simpson is great.
If you want to learn by doing, I would look away from books & more towards video based learning. It seems to have richer content in this style. Pluralsight, Frontend Masters, Egghead & Code School are all great. They also target different niches. If you're a complete beginner I suggest Code School. It does the best out of those at telling you where to start & what to learn next.
Disclaimer: I am the author of the book
Note: this is a pre-ES6 book.
Build Better Applications with Coding and Design Patterns /
By Stoyan Stefanov
* Exploring ES6
* Exploring ES2016 and ES2017