DEV Community

Cover image for 10 JavaScript Tips I Wish I Knew as a Beginner.
Ruby Dahal
Ruby Dahal

Posted on

10 JavaScript Tips I Wish I Knew as a Beginner.

So, You Want to Learn JavaScript? Read This First.

When I first started learning JavaScript, I honestly thought it would be pretty easy.

I mean, I already knew a little HTML and CSS, so I thought JavaScript would just be about adding some buttons and making things move.

Yeah... not exactly.

JavaScript is really useful, but it can also be confusing, especially when you're just starting. Sometimes your code works perfectly, and sometimes you change one small thing and suddenly you have no idea what happened.

But that's also what makes learning it interesting.

JavaScript is basically what makes a normal webpage interactive. You can use it to make buttons work, create animations, validate forms, build games, make websites dynamic, and a lot more.

The more I learn, the more I realize there's a lot to JavaScript. So if you're also a beginner, here are some things I wish someone had told me when I started.

1. Use const and let instead of var

If you're watching older JavaScript tutorials, you'll probably see var everywhere.

At first, I didn't really understand why people kept saying to use let and const instead. But it's actually pretty simple.

A basic rule is:

  • Use const when you don't need to change the value.
  • Use let when you know the value will change.
  • You usually don't need var in modern JavaScript.

For example:

const studentName = "Shridha";

let attendance = 80;
attendance += 1;
Enter fullscreen mode Exit fullscreen mode

Here, studentName isn't being changed, so const makes sense.

But attendance changes from 80 to 81, so we use let.

This might seem like a small thing, but getting used to it early makes your code much easier to understand.


2. Get comfortable with the console

One thing I learned pretty quickly is that console.log() is actually really useful.

When something doesn't work, I sometimes just stare at the code thinking, "What is wrong with this?"

Instead of doing that, just check what's actually happening.

const username = "Shridha";

console.log(username);
Enter fullscreen mode Exit fullscreen mode

You can use it for more than just variables too.

console.log("User:", user);
console.log("Users:", users);
console.log("Result:", calculateTotal());
Enter fullscreen mode Exit fullscreen mode

It can help you see what's inside an array, what a function is returning, whether your data is coming from an API, and so on.

It sounds very basic, but you'll probably use console.log() way more than you expect.

So when you're confused, don't guess.

Log it.


3. Read the error before searching for it

Red error messages are honestly one of the most annoying things when you're a beginner.

At first, I used to see an error and immediately search the whole thing online.

But it's actually worth reading the error first.

For example:

ReferenceError: username is not defined
Enter fullscreen mode Exit fullscreen mode

You can break it down pretty easily.

ReferenceError means JavaScript can't find something you're trying to use.

username is the thing it can't find.

not defined basically means JavaScript looked for it and couldn't find it.

Then look at the line number the error gives you and check what's happening there.

You don't need to understand every error immediately. You'll learn them as you come across them.

The important thing is not to panic when you see an error.

An error doesn't mean you're bad at coding.

It usually just means your code is trying to tell you something.


4. Understand truthy and falsy values

This was one of those JavaScript concepts that confused me a little at first.

JavaScript doesn't only treat true and false as true and false.

Some other values are considered falsy:

false
0
""
null
undefined
NaN
Enter fullscreen mode Exit fullscreen mode

Most other values are truthy.

For example:

const username = "";

if (username) {
  console.log("Username exists");
}
Enter fullscreen mode Exit fullscreen mode

The username is an empty string, so it's falsy.

Because of that, the console.log() doesn't run.

You'll see this kind of thing quite often when working with forms, user input, APIs, and other data.

Once you understand truthy and falsy values, some JavaScript conditions that looked confusing before start making more sense.


5. Use template literals for strings

When I started, I used + whenever I wanted to combine a string and a variable.

Something like this:

const name = "Shridha";

console.log("Hello " + name + ", welcome back!");
Enter fullscreen mode Exit fullscreen mode

There's nothing wrong with it, but it can get messy when the sentence gets longer.

A cleaner way is to use template literals.

const name = "Shridha";

console.log(`Hello ${name}, welcome back!`);
Enter fullscreen mode Exit fullscreen mode

You use backticks instead of normal quotation marks, and then put your variables inside ${}.

You can also put calculations inside them:

const price = 500;
const quantity = 2;

console.log(`Total: ${price * quantity}`);
Enter fullscreen mode Exit fullscreen mode

This is one of those small things that makes your code look and feel much cleaner.


6. Learn functions early

Functions can seem a little confusing when you first see them, but don't avoid them.

They're actually one of the most useful parts of JavaScript.

Let's say you want to greet three people:

console.log("Hello Shridha");
console.log("Hello Alex");
console.log("Hello Sam");
Enter fullscreen mode Exit fullscreen mode

Instead of writing the same thing again and again, you can make a function:

function greet(name) {
  console.log(`Hello ${name}`);
}

greet("Shridha");
greet("Alex");
greet("Sam");
Enter fullscreen mode Exit fullscreen mode

Now you have one piece of code that you can reuse.

Functions are also useful because they help you break your code into smaller parts.

Instead of having one huge block of code doing everything, you can have different functions doing different jobs.

You'll definitely use them a lot once you start building actual projects.


7. Learn .map(), .filter(), and .forEach()

If you're learning JavaScript, you'll probably spend a lot of time working with arrays.

For example:

const numbers = [1, 2, 3, 4];
Enter fullscreen mode Exit fullscreen mode

Let's say you want to double every number.

You can use .map():

const doubled = numbers.map(number => number * 2);

console.log(doubled);
Enter fullscreen mode Exit fullscreen mode

This gives:

[2, 4, 6, 8]
Enter fullscreen mode Exit fullscreen mode

If you only want numbers greater than 2, you can use .filter():

const filtered = numbers.filter(number => number > 2);

console.log(filtered);
Enter fullscreen mode Exit fullscreen mode

And if you want to do something with every item, you can use .forEach():

numbers.forEach(number => {
  console.log(number);
});
Enter fullscreen mode Exit fullscreen mode

You don't have to memorize every array method right now.

I'd say start with these three and actually understand what they do.

If you're planning to learn React later, you'll probably notice .map() everywhere.


8. Write comments, but don't comment everything

Comments are useful, especially when your code gets longer.

But you don't need to explain something that's already obvious.

For example:

// Create a variable called username
const username = "Shridha";
Enter fullscreen mode Exit fullscreen mode

The code already tells us that.

A better comment would explain something that isn't obvious:

// Retry once because the API sometimes takes longer to respond
fetchData();
Enter fullscreen mode Exit fullscreen mode

That actually gives us some extra information.

I think a good way to think about comments is:

Don't explain what the code is doing. Explain why you're doing it.

Also, remember that comments are for humans, not JavaScript. They won't make your code work if the actual code is wrong.


9. Don't try to solve everything at once

This is probably something every beginner needs to hear.

Let's say you want to build a to-do app.

If you think:

"I have to build the whole application."

it can feel like a lot.

Instead, break it down.

First, make an input.

Then make a button.

Then figure out how to get the text from the input.

Then display it.

Then add a delete button.

Then maybe add a completed state.

Then save the tasks.

Suddenly, the project doesn't seem as scary anymore.

You're just solving one small problem after another.

I still find myself doing this whenever something feels too complicated.

You don't have to know the whole solution before you start.

Sometimes you just need to figure out the next step.


10. Build things before you feel ready

This is probably my biggest tip.

Watching tutorials feels great because everything works.

You follow along, type the code, and suddenly you have a working project.

Then you try to build something on your own and realize:

"Wait... I don't remember how to do any of this."

That's normal.

It doesn't mean you learned nothing.

It means you actually found the part you need to practice.

Start with small projects like:

  • Calculator
  • To-do list
  • Quiz app
  • Countdown timer
  • Weather app
  • Notes app
  • Simple portfolio
  • Expense tracker

Your first project probably won't be amazing.

Mine wouldn't be either.

The point isn't to build something perfect. The point is to actually use what you've learned.

You'll get stuck.

You'll search things.

You'll make mistakes.

You'll probably break the code a few times.

But every time you fix something, you understand a little more than you did before.


One More Tip: Don't Try to Memorize JavaScript

This is something I wish I understood earlier.

When you're learning programming, it can feel like you need to remember everything.

You don't.

There are way too many methods, functions, rules, and pieces of syntax to remember all of them.

Even developers look things up.

Maybe you forget how .reduce() works.

Search it.

Maybe you don't remember the exact syntax for something.

Look it up.

Maybe you get an error you've never seen before.

Search the error.

That's completely normal.

What matters more is understanding what you're trying to do and knowing how to find the information you need.

Over time, you'll naturally remember the things you use often.

So don't spend all your time trying to memorize JavaScript.

Spend more time actually using it.


Final Thoughts

JavaScript can definitely be confusing when you're starting.

There are going to be times when you look at your code for 20 minutes and then realize you forgot one character.

It happens.

There will also be times when you don't understand something even after watching three different tutorials.

That's okay too.

You don't need to know everything before you start building.

Learn something small.

Try it yourself.

Break your code.

Figure out why it broke.

Fix it.

Then try something a little harder.

That's basically how I'm learning JavaScript, and honestly, I think building things and making mistakes teaches you much more than just watching tutorials.

So if you're a beginner right now, don't worry too much about being perfect.

Just keep coding.

And eventually, JavaScript will start making a little more sense.

Happy coding! 🚀

Top comments (5)

Collapse
 
alexandersstudi profile image
Alexander

The shift away from var isn't just a syntax preference, it completely changes how scoping behaves. Because var is function-scoped rather than block-scoped, it silently leaks out of loops and conditionals, which causes massive state bugs in larger applications. Defaulting to const everywhere until the compiler yells at you forces you to be intentional about what actually needs to mutate.

Collapse
 
samridhee_ghimire_090a0b5 profile image
Samridhee Ghimire

Insightful

Collapse
 
shibi-11 profile image
Shibi

Great 💜

Collapse
 
ignaci04rrigada profile image
Ignacio Arriagada

Great post!

Collapse
 
prasamshaadhikari profile image
Prasamsha Adhikari

these tips will help for sure, happy coding