Learning JavaScript from zero

Guys i got seriously stuck and demotivated because i don’t know what i missed on my road to learning JavaScript and programming logic in general.

I’ve started taking JS seriously since January this year(working on it every single day).
I finished whole es5 and half es6 on fcc curriculum, and im actively doing Udemy course and building projects(2 of them).

Up until this point, Udemy course and my attention was on exclusively es5 syntax , and i highlight “syntax” for reason.

Since i started learning ES6 it hit me like a train, like totally new programming language.To be specific, arrays bring the most of uncertainty. All that new methods filter,reduce,sort,map,from and destructuring , spread operators, rest parameters, etc. It’s all about arrays in different ways and situations which i don’t understand when they will appear and why.

I saw this quote from one of FCC blog posts and it says:

“The biggest mistake I see new programmers make is focusing on learning syntax instead of learning how to solve problems.”

Yeah… This appeared after i got myself digging trough JavaScript as self-taught.

So my ultimate question is, what order should i take in learning from this point:
a) learn data structures because i feel like my array confusion comes from that hole and then continue with es6.
b) push trough syntax and then come after data structures and algorithms
c) stop learning syntax until i understand data structures and algorithms on basic level.

I’m sorry for a long text, and please write what order you think is most logical.

I recommend learning about Higher Order Functions first, namely map and filter, then moving on to reduce. ES5 supported these too, but the anonymous function syntax made them kind of cumbersome to use, whereas the introduction of arrow functions caused them to become much more popular.

Starting with ES6 might have made it easier, but most courses, FCC included, don’t do it that way because they were written before ES6 came about.

1 Like

ES6 provides a lot of features to the language that more or less are just syntax sugar.
Let’s say you want to add all the values in an array here’s probably what you would do without ES6

var arr = [1, 2, 3];
var sum = 0;
for (var i = 0; i < arr.length) {
  sum = sum + arr[i];
}
console.log(sum); //6

Here is the approach leveraging the new ES6 method .reduce:

var arr = [1, 2, 3];
var sum = arr.reduce(function(sum, num) {
  return sum + num;
}, 0);

Taking things further, we can replace the function with the arrow function, which is easier to type. Along with this we can leverage how .reduce works without a 2nd argument, which will take the first value as the default value instead of 0. Finally we can replace all the var with const as we wont change the values later.

const arr = [1, 2, 3];
const sum = arr.reduce((sum, num) => sum + num);
console.log(sum); // 6

This is true for most of the new ES6 features. You can do the same stuff, just different ways. This goes back to the same quote you provided, its less about the problem (finding the sum of all values in an array) and more about just the syntax. If you understand how you’d solve the problem before, the solution doesn’t change, its just the syntax of the solution is “new”.

Data structures are concepts, which are more abstract then any syntax. You could study how to manipulate an Array without thinking about the language syntax at all. The concept of what an array is as a data structure has nothing to do with the syntax a given language provides to manage the array. Its good knowledge to understand data structures, but this has nothing to do with ES6 syntax. For example if I asked whats the worst way to sort an array of numbers, you could think about it in terms of JS code, but who says it needs to be JS? The problem is the same in any language, just the resulting code would be different, but this is an implementation detail.

You need to stop and ask yourself what do you not understand. Right now your assuming you understand what syntax and data structures are, and are asking if you should learn data structures because you don’t understand the syntax. This isn’t true, nor is it the right assumption. Its possible you could deepen your learning of data structures, but if your struggling understanding all the new ES6 features, then you should focus on understanding what the syntax means.

I recommend you focus on learning the syntax of the new ES6 features. Make small scripts where you play with these new features, while going through the challenges. Sites like MDN provide an excellent resource to get more familiar with the new apis (among other things)

Just remember, most of the features are just syntax sugar over things you can already do without any of these features. So don’t think your totally out of your element, you just need to review how the new code features work.

Goodluck!

Man, thank you for your time to write this, it really reliefs me. I sure will focus on es6 syntax and just repeat basic concepts that are in es5 materials. Cheers

Yeah i actually started Higher Order Functions by Travesy Media. Thank you for directions!Cheers