Over the course of my learnings in different other disciplines, I've found (after the fact) that understanding one fundamental thing is what it took for everything else in the entire discipline to start making sense to me.
As an example: I struggled with transitioning from CorelDraw to Photoshop for a long time because I didn't intuitively get the 'layer' system of Photoshop (CorelDraw, at the time - dunno if that's still the case - just gave you one workspace and you moved things about relative to each other using 'Align' settings.
I struggled with CSS until I understood the Box Model (margin vs padding vs border), and now I can theoretically understand the other things and where they fit.
With JavaScript, I'm wondering what that 'smallest unit of understanding is'? It feels like it should be functions, but despite understanding functions, it took me a while to understand callbacks, and after understanding callbacks, it took me a while to understand eventHandlers, and so on.
Curious about the experiences of more advanced JavaScript users: what was that crucial turning point for you?
All responses welcome!
Top comments (9)
When using JS on the web, for me, the units of understanding are:
The Document Object Model (you may have already interacted with this using CSS). Being able to understand that all the elements on a page are arranged in a tree and how to move the branches around.
Callbacks. JS can be a little unintuitive because of its asynchronous nature. Understanding callbacks makes most of this clear.
Eventually this understanding leads to all the shenanigans with promises, but I believe callbacks to be the unit of understanding.
Methods. From elements of the DOM tree, to inbuilt classes, to libraries, most things are interacted with using methods.
I suggest going through things in the MDN documentation to see their methods. E.g. the JS Date class.
For javascript, I would say that there are several levels of javascript that have their "smallest unit of understanding" to reach.
The "I can do this in every practical language" level:
if-statements (and, derivative from that,forandwhileloops. basically the idea of conditional code execution).These things are the basics of programming. If you know this, your skill set is Turing complete and you can create (theoretically) anything. You also still don't know anything Javascript-specific (apart from syntax) and your code can probably do a lot more when you get to the next level.
The "This makes Javascript stand out from PHP" level:
Coming from a procedural background, these ideas are what made Javascript stand out for me. Sure, these concepts can be (and are) used in PHP right now, but it's not nearly as common as in Javascript.
These concepts are used all throughout the Javascript landscape, and if you really grasp these concepts you are ready to work with the vast majority of frameworks. This is the level of most javascript developers, I think. If I had to choose only one crucial turning point, it would be this.
The "Javascript master" level:
I don't know enough about Javascript to know what else should be here, but this is the level where you know everything the language has to offer and you can use it to you heart's content. If you want to create a framework instead of use it, this is the level you need to be on.
Whoa. This is a nice framework for thinking about it. I feel like I'm, as you say, 'nearly' Turing-complete, and I can see exactly where I'm stuck: event-related JavaScript, including things involving some form of API/state-setting.
This is useful. Very.
If you are coming at this from a CSS/Design/Front-End point of view (and it sounds like you are), understand how JavaScript relates to the DOM (Document Object Model). What is the window? Go through the many methods of accessing elements in the document (you can do this directly with "raw" JS, you can use a framework, try all the methods you can).
Understand the DOM, and where JavaScript fits into it. Then you'll understand much more about how to use it.
Thank you so much for the advice, Ben!
I think there's a few 'eureka' moments that come when learning JS, after getting your head around the basics:
I ignored the details and tried hard to understand concepts from a high level--The concept of programming.For js, its the concept of "object" mostly. It was really confusing for me at first,but once I understand it, the rest is starting making sense. Like Functions, Arrays, Methods...I am still very new though :)
Thank you very much! This is helpful as I'm not sure I really understand Objects. Hopefully this begins a path to a good domino effect of learning!
this