Javascript first steps
If you’re in the baby phase, this lesson is for you. Here, you’ll learn:
- What to focus on for the baby phase.
- How to overcome challenges that may surface for you.
- What you need to know before moving on to the next phase.
If you’re way past the baby phase, you might still want to review this lesson and see if you missed anything fundamentally important. (I hope you didn’t!).
If you don’t know which phase you’re in (or if you’re in a more advanced phase), it might be worth it to read through this lesson to see if you’re already past the baby phase. If you are, you can look forward to the next lesson.
Without further ado, let’s dive into what to focus on for the baby phase.
What to focus on in the baby phase
The focus of the baby phase is to get you familiarized with the JavaScript syntax. In this phase, you’ll:
- Learn how to declare variables.
- Learn what are Strings, Numbers, Booleans, Null and Undefined.
- Learn what are Arrays, Objects and Functions.
- Learn to use
if
andelse
statements. - Learn how to compare variables.
- Learn to use the
for
loop.
Here are some resources that’ll help you through the baby phase. Feel free to go through any one of them. If you want to, you can go through all of them to get a solid understanding before moving on.
Free resources:
Paid resources:
- Code School – JavaScript Road Trip Parts 1, 2 and 3
- Frontend Masters – Introduction to JavaScript Programming
- Frontend Masters – From Fundamentals to Functional JS
As you go through these resources, focus on learning how to write JavaScript. Follow through with the examples. Make sure you type your code word for word in your text editor so you get used to writing JavaScript.
Don’t worry if you make a mistake. You probably had a typo error you couldn’t spot. Learn how to use console.log
to debug your errors so you know what went wrong.
Also, don’t worry if you’re not using best practices at this point. They key here is just to get familiar with JavaScript and be confident in using the basic things listed above.
At the end of this email, you’ll find a list of questions you can use to check your understanding before moving on to the next phase.
But before that, let’s tackle some common questions or challenges that’ll surface at this point:
Common questions and challenges
1. How long would the baby phase take?
It depends on how much time you’re willing to commit to learning. Generally, emerging from the baby phase with firm fundamentals would take you anywhere between one day to one week.
2. How do I use these syntax stuff that I just learned?
The easiest way to start using what you’ve learned is to link your JavaScript file to your HTML file with the <script>
tag.
Once linked, open up your developer tools and navigate to the “console” section. (In Chrome, its view > developer > developer tools
). You’ll be able to use console.log
to output your statements into the console.
Don’t worry about using them to manipulate HTML and other stuff right now. You’ll cover them in the next phase. Trust the system.
3. What is this ES6 thing that people keep talking about?
JavaScript is also named ECMAScript. The number 6 tagged at the end is a version of JavaScript. Traditionally, the most popular ones are version 3 (super old now), 5 and 6.
ES6 is one of the recent advancements in JavaScript. Now, almost all ES6 features have been integrated into JavaScript, so you can effectively use anything ES6 related.
At this point, diving too much into ES6 would be confusing for you. If you’re interested though, read this article to find out more. Focus on the “const and let” part and the “arrow functions”.
4. Why learn JavaScript, not jQuery?
Great question. jQuery is a library that’s built on top of JavaScript. It used to be crucial to manipulate HTML. But, with recent advancements in JavaScript, jQuery is no longer needed.
Eventually, its more beneficial in the long run to learn JavaScript because you can apply its concepts to any library you use in the future.
5. Why does JavaScript seem so illogical?
Every language is different. They have their pros and cons. Their idiosyncrasies. Just like how English is completely different from French, JavaScript is different from any other language you may have came across, even though there may be similarities.
Instead of feeling that JavaScript is illogical, try embracing JavaScript’s weirdness. Be open to it. Accept it for what it is for and you’ll learn it quickly. Maybe you’ll think JavaScript is awesome once you finally get it?
A list of questions to check your understanding
The final part of this lesson is a list of questions you can use to check your understanding.
Don’t be overwhelmed by how big it looks. Try to answer each of the questions within. When you can answer everything, you know your fundamentals are firm enough to move on.
Here we go:
- What are the five primitive values in JavaScript? (There are six if you consider ES6).
- How do you declare and assign variables in JavaScript?
- What’s the difference between
const
,let
andvar
? - What do each of the following operators do?
+
-
*
/
%
- What do each of the following comparison operators do?
===
!==
>
>=
<
<=
- How do you use the following conditionals?
if
if else
else
- How do you use a
for
loop? - What is an array?
- How do you put values into arrays?
- How to you get values out of arrays?
- How do you remove a value from an array?
- How do you loop through every value of an array?
- What is an object?
- How do you put values into objects?
- How do you get values out from objects?
- How do you remove a property from an object?
- How do you loop through every value of an object?
- What is a method on an object?
- How do you define methods?
- How do you call/invoke a method?
- What is a function?
- How do you define functions?
- How do you call/invoke/execute functions?
- How do you pass arguments into a function?
- What does the
return
keyword do in a function?
That’s it!
When you’re done answering these questions, send it over to me by hitting reply. I’ll help you look through it to make sure you’re on the right track for the next phase.