Top Mistakes I made as a JavaScript Developer.
Tags: javascript, webdev, codenewbie, career
Published: 2021-06-02 07:54:56

## Top Mistakes I made as a JavaScript Developer...

<blockquote class="twitter-tweet"><p lang="en" dir="ltr">Top Mistakes I made as a JavaScript Developer...<br><br>A Thread... <a href="https://t.co/3gejhKTv3T">pic.twitter.com/3gejhKTv3T</a></p>&mdash; Ankur💻🎧💪 (@TheAnkurTyagi) <a href="https://twitter.com/TheAnkurTyagi/status/1399987615001026563?ref_src=twsrc%5Etfw">June 2, 2021</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script> 


> 
Today, JavaScript is at the core of virtually all modern web applications.

Let me show you some typical mistakes that almost every JS programmer has made during their career.

I've been a JS dev since 2014 & I still make some of these mistakes, especially when coding in a hurry.

## ▫ Do you remember the difference between «=», «==»  and «===»?

You might encounter a problem with code Down pointing backhand index 

You'll get “Hello”! Why?

Because you don’t understand the difference between the 3 operators mentioned above.

![carbon(59).png](https://cdn.hashnode.com/res/hashnode/image/upload/v1622619792149/zHRG46NF0.png)

**Let’s get this thing over with and go further: **


> 
“=” is the equal operator, so it’s used for assignment. 

In our example, we assign seven to “x” in the condition and get words of welcome “Hello”. 

The correct code looks like this:

We get “Nope”.

![carbon(60).png](https://cdn.hashnode.com/res/hashnode/image/upload/v1622619843215/ExN0L2tZz.png)


> 
“==” is the loose equality comparison operator.

Why loose? Because it allows converting values from one type to another to compare them


> 
“===” is the strict equality comparison operator. 

If this operator returns “true” it means that our values are identical both in value & type.

## ▫ Inefficient DOM manipulation

JavaScript makes it relatively easy to manipulate the DOM (i.e., add, modify, and remove elements).

A common example is a code that adds a series of DOM Elements one at a time. 

Adding a DOM element is an expensive operation.

One effective alternative when multiple DOM elements need to be added is to use document fragments instead, thereby improving both efficiency and performance.


![carbon(61).png](https://cdn.hashnode.com/res/hashnode/image/upload/v1622619910200/5Qugd2cEV.png)

## ▫ Used '&' when I mean to use '&&'

The 'bitwise' & is used to compare Integers, and if the values being compared are not Integers, they are coerced into Integers. 

The standard && is used to compare the truthiness of the operands.

So 123 & false === 0 (because the false becomes a 0) 

but 123 && false === false 9 & 5 === 1 but 9 && 5 === 5.

But why does 9 && 5 === 5 and not equal true?

### Can you tell me why? Try yourself...


## ▫ Misunderstand the difference between “let”, “const”  and “var”

Let’s first look at the code below:

The code is logical as the output, no questions.


![carbon(62).png](https://cdn.hashnode.com/res/hashnode/image/upload/v1622619993901/Sgd6X-IzU.png)

**Another example:**

The reason is that var is function scoped and let is block scoped. 

When you declare a variable with a let keyword, they are moved to the beginning of the block. 

This may lead to a reference error when you try to access the variable before the initialization.


![carbon(63).png](https://cdn.hashnode.com/res/hashnode/image/upload/v1622620052552/o-zaR3zN3.png)

## - Incorrect use of function definitions inside for loops

## - Fail to notice that 'this' is not always 'this'

## - Incorrect references to instance methods

## - Thinking that variables can be scoped to their blocks

## ▫ Fail to use “strict mode

“strict mode” (i.e., including 'use strict'; at the beginning of your JavaScript source files) is a way to voluntarily enforce stricter parsing and error handling on your JavaScript code at runtime, as well as making it more secure.

### Some key benefits of strict mode:

- Makes debugging easier.
- Prevents accidental globals.
- Eliminates this coercion.
- Makes eval() safer. 
- Throws error on invalid usage of delete.

In the end, 

I would say the better you understand why and how JavaScript works and doesn’t work.

The more solid your code will be...
The more you’ll be able to effectively harness the true power of the language...

Happy coding...

If you’re a beginner at JavaScript and want to learn JavaScript e2e concepts, here’s a great course by WellPaidGeek who is coding for 20+ years?

I highly recommend buying this course.

link if someone is interested.  [JavaScript](https://wellpaidgeek.teachable.com/p/beginners-javascript/?affcode=391490_mb0iiogk) 

Use  coupon_code=70KSPECIAL

Thanks for reading. If you like this might be you are interested in my eBook as well.

I have recently written a book for developer growth & shared my 11+ years of experience.

Grab the book now at a discounted price... [ThePrimeGuide](https://gumroad.com/l/nextgendev/grow) 

I'm writing threads to help you to become a better software engineer (developer)...

"Don't miss out" Follow your mentor  on Twitter 👉 [TheAnkurTyagi](https://twitter.com/TheAnkurTyagi) 


For more on my latest blogs: 
Checkout -->  [THEANKURTYAGI.COM](https://theankurtyagi.com/)