DEV Community: Rahul Saha

Interview Question

Rahul Saha — Sat, 08 May 2021 15:20:26 +0000

Q1: What is means by truthy and falsy value?
Ans: In javascript, a truthy value is a value that considers true when encountered in a Boolean context. We consider the value that passes in the if block. Truthy value is true, {}, [], 42, "0", "false", new Date(), and falsy value is false, 0, "", null, undefined, NaN.

Q2: What is the difference between null and undefined?
Ans: Undefined variable is those that variable is declared in the program but have not been given any value. But the null value is used to represent the no value or no object. It implies that no object, null string, no valid boolean value, no number, no array object.

Q3: How you get undefined?
Ans: I think I get undefined in two ways. One is if I declared a variable but not given any value and another is I call a function that has to return nothing.

Q4: What is the meaning of == and ===?
Ans: == is slite restrict in checking two variables that are equal or not but not check their type. In ==== is restrict in checking two variables that are equal and also check their type.

Q5: What do you mean by block scope and functional scope?
Ans: A block scope is an area within if, switch conditions or for and while loops. Functional scope means the area within the function.

Q6: How you declare a private variable in JavaScript and what is encapsulation?
Ans: Private property of an object is declared using _ adding at the first position of a variable.
Ans: A group of related variables and functions seems to be a unit where the variables are called property and functions are call methods And this process is called encapsulation.

Q7: What is the meaning of this keyword in js and how you understand it?

Ans: In javascript, this refers to the object that it belongs to. In a function, this refers to the global object ( in browser this refers to window object ). In method call or property call, this refers to the left side object of . notation.

Q8: Tell detail about the call, bind, apply?

Ans: If I want to bind an external function to an object I use the call() method to the function. If I want to bind an external function to an object I also use apply() method to the function. The difference between call() and apply() is that the second parameter of the apply() is an array. Bind also works the same style as call() but it returns a function.

All About React

Rahul Saha — Fri, 07 May 2021 14:45:27 +0000

React JSX: react jsx is neither a string nor an HTML tag. It's a powerful thing where we can use all javascript power. We can create HTML elements using javascript.

let element = document.createElement("h3")
element.innerText = "hi Rahul"
document.getElementById("app").appendChild(element)

In this process, we can create Html element using js. In the backend react is automatically creates the element in this process.

import React from 'react';
const element = React.createElement('h1', null, "Hello Rahul");

Here element is a valid JavaScript object. so we can do anything with it. We can write in a more simple way like this

import React from "react";
const element = <h3>Hello Rahul</h3>;
console.log(element);

Now JSX means javascript XML that looks like this up code and this conversion happen using babel
We can use javascript in jsx inside {} notation . We can set attribute in jsx like HTML tag.

ReactDOM.render(element,  document.getElementById("app"))

this line shows the react element in the HTML page. if we change the element like then the code looks like

import React from "react";
import ReactDOM from "react-dom";
setInterval(() => {
const element = (
<h3 className="h3">
<span>
Hi Rahul
{Date()}
</span>
</h3>
);
ReactDOM.render(element, document.getElementById("app"));
}, 1000);

Browser DOM:

This is the HTML rendering process in the browser. If we change something on the page it will rerender the page each change. So if we rerender the page it will slow the browser.

Batch update: Batch update is an update process where first all update happens then render the page at last.

Virtual DOM: In this process, a replica of the main dom is created and which is a javascript object. If something is changed in the dom react graph the change using reconciliation algorithm and find the change.

useState(): useState is a function that controls the state of the react component. Here state means the data that change for each update. This is called the state of a react element.

JavaScript

Rahul Saha — Fri, 07 May 2021 09:13:37 +0000

Primitive VS function and Object: primitive is that data type that has no methods like string, number, boolean, null, undefined, bigint. But function and object are also represented value but they are not primitive. All of these represent data of different types in javascript. type of()is a function. this function takes one parameter and finds the type of that parameter.
javascript event loop:

This is the bigger picture of the JavaScript engine. We all know that all programming language work line by line that's means up to bottom. So if somewhere of the code a big loop is defined( like while or for) then it take time to execute and it can block the whole browser so we can not click at that movement. this is the blocking behavior of javascript. We all know that javascript is a single threat language. That means it can do one task at a time. Now call about stack you can think it's like a container that reserves the task and then resolves it. But if we want to work using javascript in a non-blocking way we use the async way. Some web API functions work in this way like setInterval(). it passes from stack to web API and waits there and all other tasks are resolved at this time so no blocking happens. after all, the task finish in the stack then the setInterval passes to the callback queue and an event loop always checks if the stack is empty or not if it finds empty it pushes the task from the callback queue to the stack.
Error handling: error happens when data loads from some form or somewhere else like ajax calls. Where use try and catch statement to handle the error. The try statement check if there is any error happens the catch statement catch the error and handle the error and the throw statement throws the customer error and finally statement execute the code after try and catch regardless of the result.
Comment and Coding style: comment is not related to coding but relates to understanding your code to others. it is used in javascript by using // or /**/.
Coding style is more important for better understanding. in debugging not use console.log for array use console. table()
If we want to find where some task is happening like delete or edit use console. trace() to find which line the task is happening.
In a function argument if pass an object and inside the function, if we use the property of the object use restructure, and that makes the code clear.
In string concatenation use backtrack and use the symbol ${} that is more effective.
Use function if the same task can do much time that skips the redundancy of the code.
If we want to update the object property or add more property use spread syntax. This syntax is also used for the array.
For handling array use the modern JavaScript array method.
Use async and await for loading data from server to client without using promise and then.
Block Bindings: let is block scope and var is function scope. Global function and global variable are attached to the window object
Hoisting: Hoisting means to lift up and actually it does this.

console.log(a)
var a= "Bangladesh";

the output is undefined. Then what actually happens? when we declare the variable with var we actually take two types of work one is the declaration and the other is the assigning a value. This actually happens in the JavaScript runtime engine. The JavaScript runtime engine first javascript runtime engine declare all variable so if a variable is declared but not assign a value then if console.log it shows undefined.

var language1 = "JAVA";
var language2 = "JS";
function getLanguage() {
if (!language1) {
var language1 = language2;
}
return language1;
}
console.log(getLanguage());

Do you tell me what is the output of this code? So hoisting defined the variable at the top of its scope. This hoisting not only works on a variable but also a function too.

console.log(sust)
const  sust = ()=>{
myfun = "hi";
var myfun = "si"
console.log(myfun);
}

what is the output? here also use hoisting.
This hoisting all about the js execution pattern. JavaScript runs two stapes one is compilation state and then execution state.
Default parameter: if a function takes a parameter but when we call the function without giving the parameter value then we get an error. So for escape from error, we can set a default value for that parameter.
Spread operator: … is called the spread operator. it can edit, delete, add elements of an array.

let v = [1,2,3]
let c = [...v,4,5,6,7]
console.log(c)

spread operator can also use an object in the same way. spread operator copy the existing array or object because in JavaScript object and array is a reference type.
Higher-order function: first we understand what is functional programming in js? if a function takes a function as a parameter and returns a function then this process is called functional programming.
first-class function: in js function is a special type of object. Because this function has some property also.
Arrow function: it simplifies the function decoration and understands. if the callBack function is a normal function then it changes this inside the function and sets the global context. But arrow function can not change this value