Some Important Tricky Concepts of JavaScript

JavaScript has some tricky concept which is turned to be most important when you are preparing yourself for an interview.

Truthy vs Falsy

Truthy Value

  1. A string holding a zero like: (‘ 0 ’)
  2. White space given in empty string.
  3. A string holing a text like: (‘ false ’)
  4. An empty array like: []
  5. An empty object like: {}

Falsy Value

  1. null
  2. undefined
  3. NaN
  4. 0
  5. false
  6. empty string

null vs undefined

On the other hand, undefined can occurs in many ways. Let me explain:

  1. If we declare a variable but is not initialized, then it will be undefined.
  2. Suppose we create an object. Now if we try to access any property which is not present in that object, then it will be undefined.
  3. Similarly, if we create an array, then try to access an element that is not present at all. Then it will be undefined. And so on

Double equal (==) vs Triple equal (===)

Double equal

In JavaScript, it’s a very loose type of equality. Which means, the only value is checked in terms of comparison. So in double equal, you can say both values comparison is being counted. Which type of values are those that doesn’t matter.

Triple equal

In JavaScript, it’s a very strict type of equality. Which means, both type and value must be checked in term of comparison. So in triple equal, you can say both type and value comparison must be the same.

Map vs Filter vs Find

.map() execute the same code on each element in the declared array and return a new array with the updated element.

.filter() checks every element in the declared array to see if it meets a certain condition and returns a new array with the elements that return truthy for the condition.

.find() checks every element in the declared array to see if it meets certain criteria and returns the first element that is truthy for the criteria.

Scope

Global Scope

Global scope in JavaScript is define the outside area of the function. Variable that declare inside the global scope can be accessible in any other scopes.

Local Scope

When we declare a variable inside the functions , it become local to the function and are considered as a local scope variable. A local scope can be classified as a function scope and block scope.

Function Scope

When we declare a variable in a function, the variable is accessible only within the function. We can’t access it outside the function. var is used to declare a variable for function-scope accessibility.

Block Scope

Block scope is the area with if condition or switch statement or for and while loops. Usually, we see a block with {curly brackets}. In ES6, two keywords are allow to declare variables in the block scope: let, const. Those are accessible only in the corresponding block.

Closure

From a function when an inner function is being called or return, then a close environment is created. They keep a reference of an external variable. This is called closure. Example:

Closure

Here productCount function call an inner function. This inner function try to access an outer variable count. After accessing, product1 keep his own value and product2 keep his own value as they create a close environment. This is closure and this is how closure work.

Slice vs Splice vs Join

slice() takes an array, cut it from a specific area, and returns a new array with specified start to end elements. But original array will remain same.

splice() takes an array, remove some elements from a specific area returns a new array with specified start to end elements. But those elements are removed from the original array as well.

join() separate all elements of an array by a specific separator. By default, it is a comma (,) but you can use any type of separator as required. Here the original array will not be changed.

Bind

Call

Apply

Conclusion

Front End Developer | MERN Stack Developer | JavaScript & React Enthusiast | Network Engineer