10 ms·

Ask HN: How do I learn JavaScript?

• kosmodrom 7y ago
  Check this out: https://www.freecodecamp.org/ https://www.freecodecamp.org/
• matijash 7y ago
  Take a look here, for me this is "the" reference: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guid...
  • giancarlostoro 7y ago
    Whatever resource you start from this is ultimately what I go to every day at work for answers on anything JS related. Bookmark this link.
• r_singh 7y ago
  My favourite resource that I discovered a few years ago in a similar Ask HN thread: http://eloquentjavascript.net http://eloquentjavascript.net > Where do I go? You don't really need to go anywhere else (especially not into the vortex of looking for the best resource) to learn and be confident with vanilla javascript. > ... and how hard is this actually going to be? Well that depends more on you and your preference for learning materials. I studied a chapter a day (like 3 hours concentrated per day) and was done in 3 weeks.
  • rasikjain 7y ago
    Agree with op, the above link https://eloquentjavascript.net https://eloquentjavascript.net is a good resource to checkout. I have bookmarked few other links from HN https://news.ycombinator.com/item?id=13979472 https://news.ycombinator.com/item?id=13979472 https://github.com/getify/You-Dont-Know-JS https://github.com/getify/You-Dont-Know-JS https://www.robinwieruch.de/javascript-fundamentals-react-requirements https://www.robinwieruch.de/javascript-fundamentals-react-re...
  • toyg 7y ago
    Thank you, that looks pretty cool and easy to breeze through.
  • tmertensacker 7y ago
    Eloquent Javascript is indeed a good and quick read!
• d--b 7y ago
  It depends on how much programming you already know. If you don’t know any programming, it’s a bad idea to start by JavaScript. Its design has followed a path from a hackish webpage scripting language to being used server-side, so a lot has evolved and a lot of crap remains from the old days. If you don’t know programming, you’ll have a hard time discerning the newer, cleaner features from the older less polished ones. In my opinion it’s easier to learn java or C or Kotlin, which are a lot neater. And then learn about how JavaScript differs.
• disiplus 7y ago
  i think i haven't understand javascript till i have read "JavaScript: The Good Parts" now that book is old and es6 changed a lot of things, so find a good book read it and if it has examples go thru them. only with examples was i able to understand scope inheritence and asynchronous calls in javascipt. like if you call settimeout in loop and all other gotchas.
• IvanK_net 7y ago
  It is not clear, if you want to learn programming, or you alerady know it, and want to learn a new language. It takes years to become good at programming. Once you know programming, it usually takes hours to learn a new (procedural) programming language.
  • pansa2 7y ago
    > it usually takes hours to learn a new (procedural) programming language. Really? I feel like I’ve spent longer than that just trying to get my head around JavaScript’s prototypal inheritance. I’m even more confused by Promises.
    • jimmyspice 7y ago
      Prototypical inheritance is not something I really understand in too much detail (and maybe I was late to the game, since I've never really felt I missed anything). Now js has 'classes' which I think are sugar over proto, can't remember. You can think of a prototype as 'cloning' an object (but not quite), distinct from classes in OOP, which are typically created afresh, i.e. no entanglement occurs between instance 1 and 2 of the same class (unless of course explicitly specified in a constructor). If I have `var a = {one: 1, two: 2}`, I can use that as a 'live template' to stamp out other 'instances' that prototypically inherit from that ancestor. Any attribute lookups that are not specified directly on an object created with a prototype recursively look up the prototype ancestry chain until it is found. So if c -> b -> a (where a -> b means a prototypically inherits from b), looking up a property on c will try to look for the property on c first, failing that b, then a. If nothing is found, `undefined` is returned. Let's open our inspector and have a play: ``` var a = {one: 1, two: 2}; var b = Object.create(a); // create b, based on prototype a var c = Object.create(b); console.log(c.one) // 1, how, when this wasn't even defined! We looked up the p. chain until we found it b.three = 3; console.log(a.three) // undefined, a's only prototype is Object console.log(c.three) // 3, wow, c knew about something that happened to b! This is different from OOP. 'instances' share data defined at runtime. ```
    • jimmyspice 7y ago
      And now for promises. Why promises? Before promises, js code often used an error first callback strategy to communicate when an asynchronous process has finished. It's important to write blocking code as little as possible, since your computer can and should spend time doing 'compute' stuff, whilst waiting for a resource, such as a network request or disk etc.. which can take an unbounded amount of time. Back to how callbacks look: ``` function myExpensiveSuccessfulFn(cbFn) { setTimeout(() => { cbFn(null, 'success'); // pretend we did something useful }, 60 * 1000) // time waste for a minute } function myExpensiveFailingFn(cbFn) { setTimeout(() => { cbFn('oh no'); // pretend we tried to do something useful }, 60 * 1000) // time waste for a minute } function myCallback(err, data) { console.log(`err: ${err}`); console.log(`data: ${data}`); } myExpensiveSuccessfulFn(myCallback); // after 1 minute: err: null, data: 'success' myExpensiveFailingFn(myCallback); // after 1 minute: err: 'oh no', data: undefined ``` Awesome. We can wait for some result and be notified whenever it finishes. Have a play in your inspector as before. Immediately after calling our expensive functions, we can execute code straightaway (try logging anything immediately after calling an expensive function) Now callbacks start to get unwieldy when those same callbacks also want to do things that require something else asynchronously. There are better examples online, but I'll write something with anonymous functions to give you an idea: ``` function addSomethingSoon(a, b, cbFn) { // in 5 seconds, return the sum of two numbers setTimeout(() => { cbFn(a + b)// no err first style in this example }, 5 * 1000); } // now let's get the sum of four numbers: addSomethingSoon(1, 2, (result1) => { addSomethingSoon(result1, 3, (result2) => { addSomethingSoon(result2, 4, (finalResult) => { console.log(`1+2+3+4=${finalResult}`); }); }); }); ``` Only 3 operations, and things are getting quite ugly. Contrived, but let's see how we can do better. Enter the promise. A promise is a 'promise' of a future result. It's like if you went to a fast food restaurant, made an order and got a ticket in return. Once you are given a ticket, they'll call out your number and give you your food, since you are holding the ticket (the promise of food in the future). Let's have a play: ``` function getFoodIn5(menuItem) { // don't worry about the syntax here. You'll likely not be creating promises with 'new' often. You'll likely get given them from a library, say a http call or similar. return new Promise((onComplete) => { setTimeout(() => { onComplete(`fresh ${menuItem}`); }, 5 * 1000) }); } const promiseOfFood = getFoodIn5('burger'); console.log(promiseOfFood) // depends on your browser, nothing very useful, and definitely NOT our burger.... promiseOfFood.then((food) => { console.log(food); // fresh burger, yes, it tastes so good! }); ``` So we got our burger, pretty fast too. Unfortunately they just hired a few trainees: ``` function burntFoodIn5(menuItem) { // don't worry about the syntax here. You'll likely not be creating promises with 'new' often. You'll likely get given them from a library, say a http call or similar. return new Promise((onComplete, onError) => { setTimeout(() => { onError(`burnt ${menuItem}`); }, 5 * 1000) }); } const promiseOfFood = burntFoodIn5('burger'); console.log(promiseOfFood); promiseOfFood.then((food) => { console.log(food); // ... :( nothing }).catch((mistake) => { console.log(mistake) // burnt burger, you don't want to eat this. }); ``` that is promises in a nutshell. doesn't seem very useful now, but they are composable: ``` function add2(a, b) { // return a promise NOW, that will give us the sum of two numbers in 5 return new Promise((onComplete) => { setTimeout(() => { add2(a + b) }, 5 * 1000); }); } add2(1, 2).then((result1) => { return add2(result1, 3); }).then((result2) => { return add2(result2, 4); }).then((finalResult) => { console.log(`1+2+3+4=${finalResult}`); }); ``` Now we don't have the masses of indentation of callback hell. Note that will take the same amount of time to run as the callback example. Promises don't make anything faster, they just help us to write synchronous looking code. The next step to bring us back to imperative looking code is async/await. But that's for another time. Finally, the best way to learn is to do. Get a hold of VSCode, and get the Quokka extension. You can then `Ctrl+Shift+P` or `Cmd+Shift+P` and `Quokka: new javascript file`, and get a real time repl where you can mess around and log to your hearts content to get a feel of things.
• dutchCourage 7y ago
  To me, the nice part of JS is that you can get pretty far without knowing the language intricately. So you can actually get started and be somewhat productive while picking up more knowledge along the way. The front-end ecosystem is so broad that it's hard to focus only on vanilla JS anyway. That said, if you want a comprehensive read about Javascript, there's You don't know JS: https://github.com/getify/You-Dont-Know-JS https://github.com/getify/You-Dont-Know-JS
• tiborsaas 7y ago
  Start here: https://www.youtube.com/watch?v=qoSksQ4s_hg&list=PL4cUxeGkcC9i9Ae2D9Ee1RvylH38dKuET https://www.youtube.com/watch?v=qoSksQ4s_hg&list=PL4cUxeGkcC... https://www.youtube.com/watch?v=iWOYAxlnaww&list=PL4cUxeGkcC9haFPT7J25Q9GRB_ZkFrQAc https://www.youtube.com/watch?v=iWOYAxlnaww&list=PL4cUxeGkcC... I'd also use various materials, like books or courses online. Finally, start a small project in JS, best way to apply your knowledge and discover gaps.
• golergka 7y ago
  Aside from "this", all failure modes in Javascript are pretty obvious to google and figure out (unlike a segfault in C++), so I'd suggest just diving in and implementing something in it, if you already have programming experience. However, just being able to do something in a language and being able to do it the most correct and future-proof way is different, and in JS, "best practices" seem to be constantly evolving with language and community. Every library and framework seem to be doing things in a slightly different way, and there's a lot of freedom to experiment with different coding styles and programming paradigms (unlike in a language like Go). Personally, I would suggest Typescript for professional projects, but there are plenty of very knowledgegble and competent people with a lot of different opinions on it. If you're the kind of person who likes this kind of environment, you'll fall in love with JS ecosystem.
• wruza 7y ago
  Assuming you’re fluent in programming and languages in general. I just went to the console and tried all things that should and should not have work. There you’ll learn about the specifics of prototyping, properties, operators, everything, and get insights for what’s going on under the hood. Didn’t find these details anywhere else. All sources of information are situational, down-to-earth utilitarian and resemble grandma’s cooking recipes, while what you seem to want is precise chemistry. (ed: another problem with js is that most books on it are out of date by design, e.g. one of the suggested links around says that prototypes can only hold methods and not values; what else is wrong there?) >no browser APIs A big part of js internals lies in the Object namespace. See also Symbol. (MDN for both)
• sltkr 7y ago
  I liked "JavaScript for impatient programmers" (https://exploringjs.com/impatient-js/ https://exploringjs.com/impatient-js/) which is a relatively short but reasonably comprehensive explanation of modern JavaScript. In particular, it accurately describes a lot of important details (like how integer keys in objects work, "holes" in arrays, etc). It doesn't cover the complete language, in particular it doesn't cover all outdated concepts and backward-compatible features. To get a complete understanding you would have to read the JavaScript specifications, but I don't think it makes sense to start there without having a solid understanding of the basic concepts first.
  • noname120 7y ago
    I also wholeheartedly recommend this book. And you can access the HTML version almost entirely for free! If you want to dive deeper, you can then read Deep JavaScript[1] by the same author. [1] https://exploringjs.com/deep-js/index.html https://exploringjs.com/deep-js/index.html
• jfkienennd 7y ago
  I'm using http://www.crunchzilla.com/code-monster http://www.crunchzilla.com/code-monster to teach programming (and JavaScript specifically) to my year 7 (12 year olds) students at school. It's great!
• vector_spaces 7y ago
  To piggy back onto this thread: I've written a fair amount of severside JavaScript, read the Eloquent JS book, the You Don't Know JS series (which I heartily recommend to the parent), and feel I have a pretty good handle on the modern language itself. How does one take this knowledge and learn the browser APIs (in particular, best practices around those APIs) plus to navigate the frontend ecosystem in general without getting overwhelmed? Obviously you learn the APIs by building stuff, which I do. I can and do write frontend code, but always with the feeling that I've never learned this stuff properly. I know there are tutorials aplenty on this stuff -- other than MDN, is there anything authoritative, comprehensive, and deep? Like, the SICP or TAOP of frontend programming?
  • userbinator 7y ago
    is there anything authoritative, comprehensive, and deep? I would recommend the official spec. It won't be an easy read, unless you're already used to reading standardese, but there's nothing more authoritative than that.
  • pintxo 7y ago
    Not a tutorial or authoritative resource of any kind, but remember you can always open your browser of choice (on the desktop), open the developer tools and start fiddling with the browser APIs interactively, on any page you like.
• Jefro118 7y ago
  Read the You Don't Know JS series [0] - this tackles much of what people with mediocre proficiency overlook. To go beyond that you would probably want to dive deep in to the ECMAScript specs [1] to really master the language. I don't think it will be that hard, just a slog. [0] - https://github.com/getify/You-Dont-Know-JS https://github.com/getify/You-Dont-Know-JS [1] - https://www.ecma-international.org/publications/standards/Ecma-262.htm https://www.ecma-international.org/publications/standards/Ec...
  • enumjorge 7y ago
    OP, this is the best answer to your question. Lots of other answers on this thread are either ignoring the part where you said you wanted to really master the language and recommending introductory JS materials, or, bizarrely, telling you to learn something else instead. I don’t think you can master a language in one go. It’s not how most people’s brains work. I think you do it in stages. Get yourself a good introductory JS resource. The eloquent javascript book others posted looks good although I haven’t read it myself. Then read You Don’t Know JS. And then study the spec. Almost by definition the spec is the only thing that can give you a perfect and complete understanding the language. But don’t start there as a complete beginner is not its intended audience. Be sure to apply what you learn from each book by working on projects. Don’t just read the books. The material won’t stick that way.
    • RodgerTheGreat 7y ago
      Reading the spec will convey many useful details. If you truly want to master them, though, implement the spec and pass the conformance suite. If Fabrice Bellard can do it, in C, with no dependencies, you can do it in whatever language you're already comfortable with, using the standard library. It's simply a matter of sustained effort and focus over time.
      • tlarkworthy 7y ago
        Yes I discovered so much unexpected combinations of features after implementing a Java parser. Totally pointless for actually writing Java though, so I question the motivation here. Just coz something is permitted in the language doesn't mean you should. I bet the corners of JavaScript are deep. Mastering them is a party trick, rather than something practical.
• simias 7y ago
  Find whatever works for you to reach "mediocre proficiency" then use that to improve until you reach "perfect and complete level". You won't find any resource for any language that will hold your hand all the way, if only because the concept of "perfect and complete" is rather fuzzy and subjective (and probably a moving target for a language like JS that's still in active development). JS is a rather forgiving language (maybe too forgiving) that's very suitable for learning by trial and error. Get the basics, start hacking, find what works and what doesn't, look at other people's code to draw inspiration etc...
• downvoteme1 7y ago
  JavaScript.info
• finnjohnsen2 7y ago
  A little side note; You could consider ClojureScript. I've worked with JavaScript many times through the years, and never felt that I got close to becoming an expert no matter what. The language it self is in the way. Browser compatibility, language weirdness (like the =, == or === mess) and there are a lot of standards around. But now a days working with ClojureScript, which settles the language problems, I get to focus on getting good at libraries, react and browser-stuff. I hope I never have to work with vanilla JavaScript again, but since ClojureScript is a niche I'm pretty sure this dream will burst at some point. But I can attest ClojureScript has brought significantly more enjoyment into my life when dealing with front-end development.
  • LandR 7y ago
    I would second this, CLojureScript is the first language that has made front end seem sane to me. Unfortunately your chances of getting a job doing ClojureScript is probably slim to none :(
    • blunte 7y ago
      There was a time when you couldn't get a job with Linux, and you couldn't convince a company to try Linux. So you snuck it in, and in some cases the company never knew (partly because it was so much more reliable than other options that it didn't crash nor reboot). Sneak ClojureScript in. I know of one shop that trained its JavaScript engineers to use ClojureScript in two weeks. Quite frankly, if one is smart enough to write actual good, safe JavaScript, then one can definitely grok ClojureScript.
      • LandR 7y ago
        I'm a bit tempted to do something like this. We have an old creaky app which I'm tempted to rewrite in ClojureScript in my own time and then show them it. Worst case scenario they say it's great, now can we please rewrite it in JS. Best case scenario I get something in Clojure / CLJS into our system. Either way I'd probably learn a lot just from the project. And I kinda need a new side project at the minute.
• apogosyan 7y ago
  Reminds me of this thread from 2008: https://news.ycombinator.com/item?id=135494 https://news.ycombinator.com/item?id=135494
  • petercooper 7y ago
    I'm genuinely curious how that now 22 year old has turned out :-)
• hotgeart 7y ago
  https://learnjavascript.online https://learnjavascript.online if you're like me and you only learn via practices. https://javascript.info/ https://javascript.info/
• quickthrower2 7y ago
  Where don’t you go! There are tonnes of course on udemy, pluralsight and similar and often they are free (because they want you to pay for the React / hot tech du jour course), so find one that suits you. Pure JS will be a bit boring. You’d want to learn some Node apis to do something useful. But you could limit it to file I/o if it’s the JS you want to focus on. At least that’ll give you some async experience which I’m sure you’d be keen to learn.
• talkinghead 7y ago
  I would recommend Javascript The Weird Parts. Good pacing and clear exploration of the languages ‘quirks’ and a general tour of vanilla js. Then you can dive into how your own framework can be created, also interesting for obvious reasons. This course really pushed my js knowledge forward! https://www.udemy.com/course/understand-javascript/ https://www.udemy.com/course/understand-javascript/
  • hv42 7y ago
    Definitely a great course, started learning JS using that one. After watching that I would recommend https://github.com/getify/You-Dont-Know-JS https://github.com/getify/You-Dont-Know-JS and that should give one a solid base.
• InsomniacL 7y ago
  I learnt here: https://www.codecademy.com/ https://www.codecademy.com/
• hoerzu 7y ago
  For sure: https://freecodecamp.com https://freecodecamp.com
• darepublic 7y ago
  If you want a "perfect" understanding of ecmascript as it is implemented by V8 why not study the open source code for V8: https://v8.dev/ https://v8.dev/. How hard will it be? Well how good are you at reading code/ how much do you know about c++? If this seems too daunting, better stick with a less than perfect guide to get you part of the way there.
  • pansa2 7y ago
    Perhaps better to study QuickJS [0]. It implements most (all?) of the language, but without the insanely complex JIT compiler. [0] https://bellard.org/quickjs/ https://bellard.org/quickjs/
  • qwerty456127 7y ago
    > how much do you know about c++ "If you think you understand quantum mechanics, you don't understand quantum mechanics." - the same is true for C++ which is one of a few languages impossible to learn to the perfect and complete level.
• sillysaurusx 7y ago
  An unorthodox approach would be to write a transpiler for JS. I don't mean babel. I mean from scratch. Using whatever language you're comfortable with, turn lists of expressions into JS code. https://github.com/sctb/lumen https://github.com/sctb/lumen does this in just a couple thousand lines.
• saagarjha 7y ago
  > as supported by the most recent version of V8 Why choose V8 as your target, and not a recent standard that multiple modern browsers support?
  • qwerty456127 7y ago
    Because no engine implements the whole recent standard and does everything in a 100% standard-conformant way. Learning an imaginary language seems impractical. I feel more sympathetic to Mozilla than Google but from the practical point of view, again, choosing the Google version for the reference makes more sense as it has more browser market coverage + Node. I've also made a game in vanilla JS recently (using only the Mozilla website for the language and APIs reference) and it works smooth in Chrome but glitches in Firefox.
    • brlewis 7y ago
      One advantage of using browsers when you want "modern JavaScript (as supported by the most recent version of V8)" is that the fetch API provides a great opportunity to try out async/await, which is the most new language construct. You'll pick up destructuring assignment and optional chaining in minutes, but async/await will make you a better programmer in other languages too, once you get some practice with it. If you're dead set against browsers, you'll probably have to use deno since its API is friendlier to async/await than node's is.
      • qwerty456127 7y ago
        I'm not set against browsers at all. But I didn't know V8 had any problems with async/await. Tank you for highlighting this.
• deleted 7y ago
  [deleted]
• deleted 7y ago
  [deleted]
• mindspore 7y ago
  this one is also good for best practises https://github.com/ryanmcdermott/clean-code-javascript https://github.com/ryanmcdermott/clean-code-javascript
• exdsq 7y ago
  I've found these Udemy courses by Stephen Grider to be the best JS resources I've come across. He has a few courses covering modern JS and they're roughly £10 each. If you're willing to pay a little on a book or a course, take a look at these. https://www.udemy.com/user/sgslo/ https://www.udemy.com/user/sgslo/ [Not sponsered, non-affiliate link, etc]
• blackandblue 7y ago
  for the pro here who just want a quick overview of the modern stuff, i found this resource extremely valuable: https://mbeaudru.github.io/modern-js-cheatsheet/ https://mbeaudru.github.io/modern-js-cheatsheet/ i had no idea eloquent javascript was updated with modern javascript. what a surprise! i read that book many years ago. i will check the other resources too.
• ronyfadel 7y ago
  I can’t recommend Wes Bos videos [0] enough (I’m not affiliated). Something clicked for me watching his videos, made learning parts of JS easier. The JS courses are free. [1] https://wesbos.com/courses/ https://wesbos.com/courses/
• giorgioz 7y ago
  At the beginning you'll want to try things quickly. Open Google Chrome, right click anywhere and choose Inspect: this will open the Developer Tools. Click on the tab Console and type 1+1 and Enter. Congrats you just wrote some Javascript!
• british_india 7y ago
  Read: "JavaScript: the good parts"
• Cthulhu_ 7y ago
  I personally really enjoyed Javascript Allongè, which really starts from the very basics. Now under a CC license: https://github.com/raganwald/javascript-allonge https://github.com/raganwald/javascript-allonge (I know the author lurks here sometimes)
• CyberFonic 7y ago
  I like "Javascript for Impatient Programmers": https://2ality.com/index.html https://2ality.com/index.html If you mean ES6 as "modern" JS, then you might want to avoid any material on prototypical nature of "true" JS (which it still is under the hood). Personally I find classes and modules to be very useful. Although you say you don't care for DOM, CSS and the many frameworks, you might need still need to build a small HTML file to kick start your JS programs. I do all my exploring and learning in Chrome's DevTools console and debugger. JS is not that difficult to learn if you already know a curly brace language (C, C++, C#, Java, etc). Even after years of working with JS, fiddling with DOM still catches me off guard on occasion.
  • eyelidlessness 7y ago
    > If you mean ES6 as "modern" JS, then you might want to avoid any material on prototypical nature of "true" JS (which it still is under the hood). Personally I find classes and modules to be very useful. ES6 classes still use prototypal inheritance and it still has important effects on usage.
• totaldude87 7y ago
  https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/basic-javascript/ https://www.freecodecamp.org/learn/javascript-algorithms-and... this is where i got started , now got a good handle at JS, but not sure if it will fit / suit you
• ineedausername 7y ago
  https://eloquentjavascript.net/ https://eloquentjavascript.net/ enough said
  • grech 7y ago
    I found this to be the most engaging and well-written book on JS.
• austincheney 7y ago
  I started learning JavaScript in 2008. Back then the popular validation tool was JSLint whose motto is: JSLint will hurt your feelings. The idea is that under the sloppiness of the language there was a polished gem of rapid expression. I didn't really figure out the language, though, until I started writing personal tools during my second military deployment in 2009. My recommendation for learning this language is to forget all the books and helpful guides. Just build something. Here is a good reference of the standard methods: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects https://developer.mozilla.org/en-US/docs/Web/JavaScript/Refe... Of that reference list the most immediately important areas are: Array and String. My personal recommendation for really embracing this language are to learn and master scope in the language. Don't mess around with class, prototypes, inheritance, new, or this until after you have built at least one tool in the language. Most people coming into this language jump in expecting to program in the style of some former language only to be disappointed that JavaScript is not in fact their former language. My second personal recommendation is to gain confidence around the expressiveness of functions in this language. Functions are first-class objects, which means they can be used anywhere a primitive type can be used. https://developer.mozilla.org/en-US/docs/Glossary/First-class_Function https://developer.mozilla.org/en-US/docs/Glossary/First-clas... Perhaps the most important thing to learn for any language is data structures. If you have a solid understanding of data structures you can bend any algorithm to your will. You mention not learning any APIs, but there are two exceptions you should make in order to better understand the language. * DOM - If you are learning JavaScript in the browser I recommend learning the DOM. I mean the standard imperative DOM methods from the DOM specification. The DOM is a tree model of nodes where each node knows its place in the tree relative to its peers. By appreciating the nature of those fluid relationships you can do incredible things with little effort that execute incredibly fast. I built a complete GUI in the browser in just over 2 weeks that executes as fast as the OS's GUI because I had an understanding of the DOM. Here is the video demo: http://mailmarkup.org/sharefile/demo1.mp4 http://mailmarkup.org/sharefile/demo1.mp4 and code: https://github.com/prettydiff/share-file-systems https://github.com/prettydiff/share-file-systems * Nodes fs library - If you are learning JavaScript on the terminal with Node.js I recommend learning Node's fs library methods. The file system is also a tree model comprised of nodes that can be walked very quickly. After you have built one or more tools in this language you will independently learn to appreciate the conventions in this language that best suit your personal programming styles.
• smuemd 7y ago
  http://javascriptissexy.com/how-to-learn-javascript-properly/ http://javascriptissexy.com/how-to-learn-javascript-properly...
• aikah 7y ago
  https://jsbooks.revolunet.com/ https://jsbooks.revolunet.com/
• gwbas1c 7y ago
  Something to keep in mind: Javascript has a lot of obscure language idiom that aren't used in practice. This has to do with how the language was rushed into production, and has gone through quite a lot of revisions. This point is made in the (now very outdated) book "Javascript: The Good Parts," https://www.amazon.com/JavaScript-Good-Parts-Douglas-Crockford/dp/0596517742 https://www.amazon.com/JavaScript-Good-Parts-Douglas-Crockfo.... Crockford, the author, brings you through the best way to write Javascript in 2008. Related note: I once attended a talk from Crockford in 2010 where he was rather religious about how async code was significantly better than threads. I pointed out that async code is significantly harder to write due to the mess of callbacks, and his answer was quite rude. Now Javascript has async-await, which fixes the madness that comes from callbacks.
  • 101404 7y ago
    And in between callbacks and asyncawait, it had Promises. I still often prefer those over asyncawait.
    • eyelidlessness 7y ago
      Async/await is semantically just sugar for promises (though implementations don't necessarily operate that way).
      • fjp 7y ago
        I never wrapped my mind around the Promises API, but I have always async/await is much easier to grasp in any language
        • pintxo 7y ago
          Maybe because it should have looked like this (personal opinion): waitForPromise() .then(handleResolve) .fail(handleReject) .catch(handleException); But actually looks like this: waitForPromise() .then(handleResolve, handleReject) .catch(handleException);
• pharke 7y ago
  If you just want to learn the core language then there are any number of books available, or even just reading the MDN Web Docs thoroughly. It's a bit pointless to only learn the language though since you will be starting from scratch on any 'real' project that you attempt to do. Don't get me wrong, it's a good starting point but your journey will only be begun once you reach a 'perfect and complete level' of understanding. You'll quickly be forced to ask yourself what you want to accomplish with the knowledge you've gained and from there you will have to set yourself another course of learning the relevant APIs, frameworks, libraries, and tooling associated with that field. The fastest way to learn a language is to use it constantly, so my actual recommendation would be to begin by building a series of small toy projects. Build the classic ToDo app in whatever form you prefer. Build a calculator, a text editor, pong, an HTTP server, a database, a data visualization tool, a physics simulation, a paint program, etc., etc. None of them should be overly complicated, at first at least, but they will force you to think about how you use the language and will quickly show up the large gaps in your knowledge about it as well as point you in the direction of the current 'state of the art'. "Not hearing is not as good as hearing, hearing is not as good as seeing, seeing is not as good as knowing, knowing is not as good as acting; true learning continues until it is put into action." --Xunzi or if you prefer "What I cannot create, I do not understand." --Richard Feynman
• brlewis 7y ago
  No browser APIs means you'll want to use node. Except node APIs are largely based on callbacks, and you want to learn modern stuff like async/await. I think you'll learn modern JS best using deno. TypeScript is a superset of JS, and in the default configuration you can pretty much just write JS. And with APIs that are friendly to async/await you'll learn modern JS.
• thrower123 7y ago
  Just jump in and flail like the rest of us do. There's not a lot of point in obsessing over the minutiae that is constantly in flux and varying at the whim of the Chrome and Firefox teams. You'd be aiming at a moving target, and one that is constantly jinking up and down and side to side, even when it is going in the same direction and not doubling back on itself.
• christiansakai 7y ago
  Define perfect? I’m 5 years into my JS and sometimes still get bitten in the ass. Not so with other languages.
• commandlinefan 7y ago
  I poked around Javascript for years trying to obtain some proficiency at it using just online resources. I finally broke down and bought the O'Reilly book "JavaScript: The Definitive Guide". Although O'Reilly's quality has been steadily decreasing year after year, JSTDG was the perfect resource for me. What you're looking for is actually covered in the first part of the book; the remainder of the book goes on to cover the browser API and some of the server-side ecosystem.
• lurker458 7y ago
  a fun way to learn the basics, is to start playing at screeps.com. It's not applicable to web design though.
• defulmere 7y ago
  I've been working my way through the Modern Javascript course at Execute Program, so far so good: https://www.executeprogram.com/courses/modern-javascript https://www.executeprogram.com/courses/modern-javascript
• bpesquet 7y ago
  If you don't have much programming experience, you should start with The JavaScript Way (https://github.com/thejsway/thejsway https://github.com/thejsway/thejsway), which was written with beginners in mind (disclaimer: i'm the main author). Then you should study the YDKJSY series like many others have said. IMHO, Eloquent JavaScript is a great book but not really beginner-friendly. It's a solid choice if you are already proficient with another language.
• dean177 7y ago
  > I believe this is possible (and maybe not even hard) as I only mean the language itself Javascript doesn't exist in a vacuum, and focusing on becoming an expert on just the language is IMHO a misguided effort. The language is a means to an end and the most useful bits are exactly in the API's that the runtime provide, be they the browser or something like node / react-native. The advice I often give for "how do I learn ___" is find something you want to make, do what you need to do to arrive at the most basic version that you possible can, then iterate. If you have someone who can help direct you when you get stuck, or can point out ways things can be vastly better with minimal effort that will be a real boon to your efforts. Focusing on arcane corners of the language just isn't productive. If you have a mission, you can deal with those when they come up (which due to their arcane nature, will be rarely if at all).
• sjg007 7y ago
  What's the best IDE for javascript? What helps you be the most productive?
  • 11001100 7y ago
    The plugin Quokka.js[0] is in constant use and helps me to check JS code faster. I use it in VS Code. [0] https://quokkajs.com/ https://quokkajs.com/
• hajile 7y ago
  [Eloquent Javascript](https://eloquentjavascript.net/ https://eloquentjavascript.net/) -- A general intro to JS/Programming. [Javascript: The Good Parts](http://shop.oreilly.com/product/9780596517748.do http://shop.oreilly.com/product/9780596517748.do) -- Once something makes it into Javascript, it's there forever. While this book only covers up to ES5, it creates a good foundation for things to use and things to avoid. This is especially relevant if you wind up working with older codebases. [Exploring ES6](https://exploringjs.com/es6/ https://exploringjs.com/es6/) -- This book will take you from the ES5 land into the world of ES6 (ES 2015). It does NOT cover newer features from ES2016-ES2019, but only a couple of those are major updates. [Javascript Allonge](https://leanpub.com/javascriptallongesix/read https://leanpub.com/javascriptallongesix/read) -- A nice, soft introduction to functional JS concepts. [You don't know JS](https://github.com/getify/You-Dont-Know-JS/blob/2nd-ed/README.md https://github.com/getify/You-Dont-Know-JS/blob/2nd-ed/READM...) -- an overview of the language feature by feature. I feel it's a bit too advanced for an introduction on quite a few things though. I'd avoid Javascript: The Definitive Guide. It doesn't do a great job of distinguishing between the good and bad parts of the language and some examples aren't best practice anymore. Maybe they'll get around to creating a 7th edition one day that'll be worth reading. Likewise, I'd avoid reading the spec until you've worked with the language for a while. It's not light reading. I'd start with the 5.1 edition because it's much easier to approach (and much smaller at only around 250 pages). Once you've read that, it'll make reading the newer specs much easier (ES2019 spec is over 3x as long).
• iblaine 7y ago
  https://frontendmasters.com/ https://frontendmasters.com/ I’ve found the courses on this site to be great. Easy to follow, diverse, and useful for non-front end engineers like myself.
  • kenny58 7y ago
    Great tip! I would recomend this as well
• kking50 7y ago
  Read the ECMA scripts. ESPECIALLY sections 13 and 15. Seriously, even the best textbooks will only give you a superficial understanding relative to the actual standards. Sure there are different JS engines, but they all do roughly the same thing. Master the algorithms in the ECMA standard and you won't even need to read textbooks. You will be able to deduce and derive those concepts yourself. Understand exactly how JavaScript gets converted under the hood. Remember, ECMA could be implemented in any language not just C/C++. What you're looking for is algorithmic understanding. For example, here's the snippet that explains how "new" works in JavaScript https://www.ecma-international.org/ecma-262/5.1/#sec-15.2.2.1 https://www.ecma-international.org/ecma-262/5.1/#sec-15.2.2..... Going through the algorithm, your first thought may be "wtf is [[Prototype]]"? Dig into it. Understand when, where, and how [[proto]] and __proto__ get assigned. Learn about the cyclic references that allow everything to be an object including functions. Of course, feel free to use external resources to assist you while reading ECMA since it is quite dry. For the example above, this amazing Stack Overflow post can help you visualize the algorithm: https://stackoverflow.com/questions/650764/how-does-proto-differ-from-constructor-prototype https://stackoverflow.com/questions/650764/how-does-proto-di...
• carti 7y ago
  LeetCode, Project Euler, etc. are great if you're looking for a bit of structure with your practice and would give you a reason to go through the MDN docs in a more targeted way. A lot of older resources are more OO-focused, but functional JS is more immediately useful for working with modern front-end libs/frameworks, in my opinion.
• prithsr 7y ago
  I'm taking this course right now and liking it quite a bit: https://www.udemy.com/course/the-complete-javascript-course https://www.udemy.com/course/the-complete-javascript-course
• n00bdude 7y ago
  I am also in quest to learn JavaScript & found this Derek Sivers link on the subject quite insightful: https://sivers.org/prog https://sivers.org/prog
• _bxg1 7y ago
  I got to know the nuances of the language by working with it for years and having to figure out why various things didn't work at different points, but it doesn't sound like that's your style. This isn't comprehensive, but it's probably the most helpful deep-dive I've ever seen about some aspect of JavaScript. It's about the Event Loop, which is one of the biggest differences between JS and comparable languages like Python: https://www.youtube.com/watch?v=8aGhZQkoFbQ https://www.youtube.com/watch?v=8aGhZQkoFbQ Contrary to what you might think, even though the event loop is in some sense "distinct from the language", it isn't simply an API. You can't really have JavaScript without the event loop; it exists in both the browser and in Node, and is the basis for most of the language's advantages.
• talkingtab 7y ago
  A problem with learning JS is the old versus new. The language has evolved enormously. Callbacks vs async, functions and arrow functions, and "this" are a few examples. So learning JS perfectly and completely, is a bit like learning not only English, but old English as well. There is very little (if any) JS that is no longer accepted, but there are many parts that are no longer best practice. I have found that understanding prehistoric JS provides a good base for making sense of where JS is today. John Resig's (jquery) writings were very helpful, and this site is an absolute must for me. https://johnresig.com/apps/learn/ https://johnresig.com/apps/learn/
• adapter 7y ago
  First find a problem you want solve. Then, solve it with JS. That's the way how you learn stuff. Re books and online resources IDK. JS is huge and there are many ways to do JS. If you are into functional JS look for a problem in the React space. React's ecosystem incl. redux is quite far and reference-like re functional programming. If you like types => Typescript and so on. I also tried to learn JS from all the popular books and the problem was that most of the stuff I read in thos, I've never used in real life. And so much sophisticated stuff which books didn't teach was hidden in some lib's Github repos.
• Vinceo 7y ago
  Javascript.info It's free and has everything you need.
• probinso 7y ago
  You start by installing elm