I am having trouble learning javascript. Any suggestions?

Question

I've been trying to learn javascript for 5 years now. I know the basics and can sort of read most javascript that someone else has written but I for some reason still, after 5 years cannot learn this language. My brain just will not let this stuff sink in.

I am asked to write javascript from scratch at my new job and they are willing to train me and teach me but after 5 days of learning javascript I haven't retained one bit of information.

I'm totally unclear on where I am suppose to put what, the ordering, the syntax.. everything. This is after 5 years of studying this language.

Is there a chance I just cannot learn it?

I'm curious to know if there are people out there that have run into a similar problem. just not being able to retain the information..

thoughts and advice welcomed... please.. I'm getting real scared for my job.

Answer 1

W3Schools is a great (and free!) resource for picking up and learning things on your own:

http://www.w3schools.com/js/

Answer 2

I leave you here a couple of really good resources to learn the language:

• Core JavaScript 1.5 Guide
• Eloquent JavaScript (Interactive tutorial)
• Learning Advanced JavaScript (Interactive tutorial)
• QuirksMode (The prime source for browser compatibility information)
• A re-introduction to JavaScript (Great article)
• Douglas Crockford Video Series
• Introduction to Object Oriented JavaScript

Answer 3

Even the best programmers have to look stuff up. Just try to relax and make sure to take breaks when you are getting frustrated. Learn the basics of variables, loops and conditionals (if..else). You can write any program with these 3 things. You just need to give yourself some encouragement and really bone down on it. it is hard. Such is life. You can learn it if you have some discipline.

Answer 4

Take at look at this Q for more resources:

• http://stackoverflow.com/questions/11246/best-resources-to-learn-javascript

Answer 5

Just study less and program more

I bet it's just a simple matter of doing more actual programming and experimenting and doing less studying.

It's better to learn by attempting something specific for an actual program you are writing and being forced to look it up in the docs, than by reading the docs and sort-of thinking about how it might be used.

First, get a JavaScript Shell. The one I use is actually OSSP js, an impossible-to-find gem. This is partly just for experimenting with one-liners and checking syntax.

Then, instead of using JS to jazz up a document, just write a simple program in JS. As a JS learning experience, I wrote a simulation of the Monty Hall Problem. Once you can write code in the language then you can fight with the DOM. See if you can stay in the more hacker-friendly simple console environment for a while.

Start small. Write unit tests. Have fun...

Answer 6

I can sympathize. I have 20+ years of experience as a programmer, a physics degree from MIT, have programmed in Pascal, Lisp, FORTRAN, Forth, C, C++, Basic, Visual Basic, Perl, SQL, Java, C#, ActionScript (2+3), XSL, and others I forget. Trust me - Javascript is squirrely. A few weeks ago I blew an interview because I forgot some Javascript basics. I have occasionally used JavaScript in my work going back over 12 years. The information just won't stick.

I am remedying this by writing a complete application in JavaScript for fun and to really learn the language for the first time. I have been at it for about three weeks now and am making good progress. The first thing is to take it one step at a time, as other above said.

1) Core language. Learn the basics: loops, variables, operators, basic data types.

2) "this". The "this" pointer really trips me up. It does not always refer to the object you think. Read up on this subject. See these:

http://www.switchonthecode.com/tutorials/javascript-tutorial-why-the-this-keyword-breaks http://www.quirksmode.org/js/this.html

3) Object orientation in JavaScript. The prototype system in JS is tricky. I prefer Java-style inheritance. Thus I use the Prototype.JS framework. It makes my code easier to write, read, and maintain. It adds useful missing functions. It makes iteration easier. It makes navigating the DOM MUCH easier. See this:

www.prototypejs.org

4) The DOM. Begin by writing simple HTML pages. Then work up to manipulating them, like processing some simple forms. Learn the event model.

5) CSS. This gets tricky fast. I am still struggling with absolute versus relative versus fixed positioning schemes. Use FireBug for FireFox, or the IE Developer toolbar. They allow you to click on a part of your page and see what style rules are in effect for that element. As others mentioned, quirksmode.org is your friend.

6) IO. File IO Is tricky in Javascript because of the security model. Some IO is possible in limited situations, like saving images and loading data files from the server where the page is located. Learn about JSON for data interchange - it is easier than XML. (Prototype.js has JSON capability.)

7) Graphics. I am learning how to do graphics programming using the HTML Canvas element. For saving images to files, check out canvas2image.js. (I forget where I found it. Try googling.)

8) Ajax. Now things get more complicated. I will leave this subject to others.

9) Etc. Along the way, read what designers have to say about best practices. For example, which fonts should you use? I came across this gem:

http://kv5r.com/articles/dev/font-family.asp

I have to constantly refer to JS documentation to get anything done. The going is slow. Especially watch out for syntax errors. You won't be warned about many of them. I put lots of alerts in my code just to see if it is getting called. Learn the difference between undefined and null.

And don't feel stupid! JS is stupid, not you.

Answer 7

My advice:

1. Just try to build something. Ask questions when you get stuck.
2. Read these pages: http://javascript.crockford.com/

Answer 8

JavaScript: The Good Parts by Douglas Crockford.

Great book for making sense of the amalgamated mess that is JavaScript.

Answer 9

I'm going to go with Head First JavaScript. Some people like Head First books, some don't. Personally I find them very approachable. Once you have the basics down and know that you can manipulate the DOM (if that's the type of JS you're writing) I would suggest learning jQuery and use whenever you need to manipulate the DOM or make AJAX requests.

Answer 10

So as my understanding goes, what you really need is learning how to program?
With no previous experience in C/C++/Python/Java/Perl/Anything?

Ok, that's hard, not because javascript is hard, but because of the environment we're used to run it into: browsers are intricated botches of nonsense.

Even from a programmer's point of view.

A programmer knows from experience (he's been programming other kind of stuff elsewhere in sane and simple environments like command prompts or simple gui programs) what matters and what not, so he can filter browser nonsense (it's nonsense that will stay there for historical purpouses) out of the way.

You're in a dire spot, still I feel this won't be an isolate circumstance. Everything is becoming browser taylored, expertise is needed not to get lost into browser programming and we kinda forgot to tell business managers about that.

First of all, let's make a distinction. There's:

• Javascript - the language
• the DOM - the programming interface you use to move html elements around
• the frameworks (jquery, dojo, etc.) additional interfaces (sets of objects and functions making advanced use of DOM feasible).
  
  DOM has a comprehensive set of instructions available, but some of them are really frustrating and boring to put to a real use, for a number of reasons.

What you'd better learn:

• almost everything about the core Javascript language (most browsers today use something roughly equivalent to Javascript 1.5) it comprehends some interesting core objects, let's say Date and Math.
  • You'll need to understand anonymous functions: function (x) {return x+1;}
  • the "modern" object declaration syntax: {label:value,label2:value2,method1:function (x) {return x+1;} }
  • Strings and their methods
  • Arrays: [1,2,3,4,5,6,7,8,9]
  • Array methods, push(), pop()...
  • Array iteration for(i=0,i<array_x.length,i++) {...}
  • The RegExp Object, the match and replace methods of strings and the fact regexps are magical string splitters

• The concept of tree, the DOM tree, and basilar DOM methods

  • document.createElement() - they could have called it new DOMElement(), but that didn't happen
  • document.createTextNode() - as above they could have used simple strings, but they didn'
  • Element.parentNode, Element.nodeName, Element.firstChild, Element.nextSibling, Element.childNodes
  • The concept of NodeList, and the fact it is NOT an array - again they missed an opportunity to keep things simple.
  • Events and event handlers: starting with "onclick" and "onload", ending with addEventListener(), the fact it doesn't work in ie6 and ie7, and the fact attachEvent() exists there instead.

• Then some basilar framework knowledge will be in order. Framework help with complicated tricks and stuff. accordin effects, weird animations. There an heckload of frameworks out there and everyone uses his own. They're mostly based around offering a single well defined functionality on all browser: the possibility of using CSS SELECTORS in javascript instead of underpowered dom instructions. All the other tricks are nice optionals built around that.

The most à la page framework right now is jquery and most people here on stack use it. It has a somehow funny syntax full of dollar signs you could hate or love. It's powerful, I used to love it.

It usurped another framework called prototype it was really a basilar framework with a lot of problems, but it was the first. Even the name was a problem. Prototypes in fact are also a language feature of javascript. A very nice feature that make Java-obsessed people run in circles screaming, but which has nothing to do with the protype framework

Your site right now is running some accordion effects based on the protype framework.
Many notorious effects run on prototype, Lightbox is the first that comes to mind.
There are versions of accordions and Lightbox for other frameworks too. Thay have different names (thickbox, shadebox, slickbox... if I recall correctly)

Now I prefer another one, called dojo, but dojo documentation isn't really fit for non-obsessive-compulsive-human-consumption yet, so forget I ever mentioned it existed.

So, you'll have to learn the bases of one of those, let's say jquery. It's about running a query and then calling a method that changes some object properties.

jquery is pathological in having chains of methods, something like:

$('a .amazing-link').do_smtg().smtg_moar(10).apply_more_magic(10);

It works by having each and (almost) every method return a copy of the object they belong to as a result. Somewhat crazy, but effective.

Ok, this became a small pamphlet. I though there was less to write, but now that I wrote it it's a shame not to post it.

Answer 11

Have you considered a tutor? Sometimes the resources for a complicated topic like javascript assume a lot of knowledge, and you need to be able to ask questions that the books and websites don't cover. Like "What's a for loop, and why would I want one?". Maybe you know that already, maybe you don't, but I think most resources out there will probably assume that you already know things like that, and will only focus on the syntactic differences from other languages.

Too far in the other direction, and a tutorial that doesn't assume that knowledge may try to talk down to you and treat you like an idiot, or worse, will end up teaching you bad habits that will be hard to break later.

Answer 12

As someone who knows many languages, I too struggle with JavaScript from time to time. This might sound funny, but perhaps you should learn another language like Java or C instead. I wouldn't spend a lot of time on it, but get the basics down, such as:

Variables
Data Types
Operators
Flow Control
input/output
Expressions
Iteration

That sounds like a lot, but its just the basics of pretty much any programming language. Get to a point where you can make a program that asks for your name, then spits it back out followed by the numbers 1 through 100 (hint: don't output them all by hand) and write it to a text file.

A few hours with a C or Java book or tutorials and you'll be able to do this with ease. Then go back to doing some more simple things with Javascript and it will make a lot more sense.

Start simple, get comfortable and keep going. Tackle the DOM stuff later down the road.