10 Confusing things you should know as a javascript developer !!

Javascript is called the weirdest language. But if u really understand how it works you will love the language. Besides these things are also important for interview questions. If you are preparing for an interview or want to learn and think in a javascript way, this blog is for you.

What will we learn?

Truthy Vs Falsy | Null vs Undefined | == vs === | ForEach vs Map Method| Find vs Filter method | Array Methods (Slice and Splice) | Object Methods ( bind, call . apply ) | Scope and Block Scope | Window variable and Local Variable | Async And await Function

Truthy Vs Falsy:

Truthy: Truthy are expressions which evaluates to a boolean true value and falsy evaluates to a boolean false value.

How can we get truthy and falsy values in our javascript? There are several ways we can get these values. Some of the examples are shown below.

Falsy :

  1. Set 0 to a variable.

Here, we see that we set a variable value to zero and we are getting false. But if we set zero as a string then it will be true.

2. Set empty string “” to a variable without space.

But if we add space on an empty string then javascript will consider it as a string of length 1. Thus, it will be true. See the example below

3. Set undefined to a variable.

4. Set null to a variable.

5. Set NaN to a variable :

But if we set null as trying it will be truthy.

6. Set false implicitly to a variable:

but if we set this as a string, it will be truthy.

okay, I think we got enough knowledge about truthy and falsy. Now we will discuss another confusing thing that is “undefined”. When and how will we get this “undefined”? Let’s see some examples:

Different ways to get “undefined” in javascript

Set undefined implicitly to a variable and consoling it :

Left a variable without assigning a value and consoling it :

Passing fewer parameters to a function and console all the parameters in that function :

But if you do something with the parameters and console it.you will get NaN this time.

:

Accessing property of an object which does not exist :

Similarly, Accessing element of an Array which does not exist :

So, these are some ways of getting “undefined” in javascript.

Now it’s time to discuss the difference between the double (==) operator and (===) operator.

Difference between double (==) operator and (===) operator in javascript.

In JavaScript, the double and triple equals are used for comparison between two operands.

Double Equals (==) checks for value equality only. It inherently does type coercion. This means that before checking the values, it converts the types of variables to match each other.

But, Triple Equals (===) does not perform type coercion. It will verify whether the variables being compared have both the same value AND the same type.

In short: == inherently converts type and === does not convert type. Let us see some examples to clarify these things.

Using double operator :

Using triple operator:

If you do not want your program to show unexpected values ,you should get used to with “===” operator.

Difference between forEach and Map Method:

In modern javascript, we are using these two methods quite a lot. we can implement forEach or Map, anyone for looping through our elements. but there is a small difference between these two.

Map returns an array of elements whereas forEach does not. This means, after the end of the looping procedure you will get an array of elements that are satisfied by the logic, but you will not get an array from forEach. so what forEach does? forEach simply prints all the elements of that array that matched the logic.

So when to use what? If you need the array after the end of the loop and do something with it use Map but if you just want to print or send an individual element as a parameter to another function go for forEach. Let's see examples :

forEach does not return anything:

Map returns an array

So you might be thinking of what is the use of getting the same array. Well you can do method chaining with map and filter and get all the expected elements in an array but with forEach you can not. see these two examples :

Find vs Filter in Javascript

Find returns only one element (first matched element) that matches the logic you put, whereas Filter returns an array of elements. Let us see the examples:

Using Find we got the first element that matched the logic:

Using filter we got all the elements that matched our logic:

Slice vs Splice in Javascript

The slice() method returns the selected elements in an array, as a new array object. The slice() method selects the elements starting at the given start argument, and ends at, but does not include, the given end argument.

Note: The original array will not be changed.

Let us see an example :

The splice() method adds/removes items to/from an array, and returns the removed item(s).

Note: This method manipulates the original array.

we can also add items in the removed place with the splice() method. See the example below:

Differences among bind(), call() and apply() :

When we want to use a method from another object to our object we can use bind or call or apply. Bind() is considered less efficient. There are some differences between them. Let us see the methods one by one.

bind() method returns a new function, when invoked, has its this sets to a specific value. See the example below: We have an object RichMan

and we have another object called PoorMan and if we want to use the method chargeBill from RichMan we can use bind() method like this :

In the bind() method, we have to declare a variable and assign the method to it and then call it.

If we want to use the call() method for the above example, we can use like this :

Call() :

We can do the same thing using the apply() method.

apply() :

The difference between call and apply is if we use the call() method we have to pass parameters separated by a comma, and if we use apply() we have to pass an array with parameters.

--

--

--

An Aspiring Mern Stack Developer

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

Keystone — front-end framework for an easy web development

#100DaysOfCode Day 11: Project Complete!

Home page view for our project

Fancyapps — easily build overlay windows with carousel

JavaScript diagram editor that renders diagrams from PNG images (open source)

React: Updating a value in state array

Google Maps for Android Pt 2: User Location

Athrv-ED Learning Management System

Simple Movies web app with Vue, Vuetify and Django. Part 1: Setup

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Mezbaul Abedin Forhan

Mezbaul Abedin Forhan

An Aspiring Mern Stack Developer

More from Medium

8 Strategies For Completing The Idea Apprenticeships.

Strategies For Completing The Idea Apprenticeship

104: Things which have helped my anxiousness — The Fitnessista

Break a bad habit.

Getting closer to the finishing line…