Skip to content
Sign upLog in
← Back to Community
JS Good Practices
Profile icon
Roar123

I've been learning JS and I am liking it a lot so far. I am using https://www.learn-js.org/ because I like their format and style, but some conventions on the site are outdated and are not the most efficient practice.

Take the most obvious example - the website's use of var instead of let or const. Another example is the use of string concatenation. Because this is an introductory course, the examples primarily show this technique - Ex. console.log("Hello " + variable). I've been told using template literals is the best technique and I agree - Ex. console.log(`Hello ${variable}`). It's just like f-string formatting in Python which is just plain awesome! The final practice I have been told is to skip the semicolons at the end of statements because JS uses Automatic Semicolon Insertion.

My question is What are good practices and habits in JS as well as practices to avoid? Feel free to list your favorite techniques and pet peeves in the comments - I'm eager to read them!

Credit to

@MrEconomical
and
@AtticusKuhn
for the 3 listed tips!

Answered by eco27 [earned 5 cycles]
View Answer
Voters
Profile icon
BlueComet
Profile icon
AndrewZhao1
Profile icon
Roar123
Profile icon
Coder100
Profile icon
AtticusKuhn
Profile icon
eco27
Comments
hotnewtop
Profile icon
eco27

nice to see that you are learning some javascript!
here are a few more good practices to consider:

  • use === instead of == - the difference is that == does a type conversion before checking equality so you get stuff like true == [] being true, while === does not do a type conversion but rather checks strict equality
  • DO NOT USE EVAL - eval is a dangerous function and with unsanitized input it could totally break your application
  • use lambdas everywhere - arrow functions are a great addition and can make code much more readable and also neater. the only thing to be aware of is that the this context inside the lambda is the same as the this context outside!
  • have good formatting in general cough cough
    @AtticusKuhn
    cough cough
    such as spacing out operators, indenting properly, and so on. you can check out Code Formatting for more tips on code formatting.
  • always use innerText instead of innerHTML - innerHTML is dangerous as it sets the HTML of an element directly, and any malicious scripts with <script> could be injected. This is known as an XSS so always use innerText to avoid these issues
  • embrace asynchronicity - async programming is definitely a challenge for beginners especially if they haven't had much experience with async in the past. Don't try to avoid it or do some loopholes to make it sync, rather go with the async nature of javascript and learn how to use it to make your applications even more powerful.

I hope these tips helped, and good luck on your future JavaScript endeavors!

Profile icon
Roar123

@MrEconomical
Thanks for the very comprehensive list! I'm still confused about what you mean by asynchronicity. Statements are executed in the program at different times rather than at the same time?

Profile icon
eco27

@Roar123
take this example:

setTimeout(() => { console.log("1 second wait") }, 1000) console.log("hello")
Profile icon
Roar123

@MrEconomical
Ok. I don't know arrow functions yet but I'll look into them.

Profile icon
[deleted]

Two that I can think of off hand.

  • Use descriptive variable and function names
  • Split the logic of your program into functions. Ideally each one will do just one thing

A little light reading:

Profile icon
Roar123

@malvoliothegood
Thanks for the response! Is the preferred variable naming convention camelCase or snake_case? I know Python is snake_case but I've seen a lot of camelCase for JS.

Profile icon
[deleted]

@Roar123
Camel case has been the norm for years.