Beat Every ReactJS Interview with these Questions!
This is a series of interview questions I've faced.
I'm giving you a guarantee you’ll never feel ashamed in an interview Again. Let talk directly and Straight forward. We’re dividing this blog into two sections….
- JavaScript
- ReactJS
JavaScript
The Most important is you know JavaScript very well, only then you can be good at ReactJS. So let’s dive into some basic and frequently asked questions :
Core JavaScript
As per the experience of multiple interviews conducted by the interviewer the most probability of questions is:
- JS Variables
Answer: Variables are containers for storing data (values). And We’ve three types of variables in JS which are let, var and const.
The scope of a variable declared with var is its current execution context and closures thereof, which is either the enclosing function and functions declared within it or, for variables declared outside any function, global.
2. JS Functions
Answers: You can reuse code: Define the code once, and use it many times. We can pass the params to the function and use one function multiple times.
function name(parameter1, parameter2, parameter3) {
// code to be executed
return (parameter1, so on...)
}3. JS Events
Answers: HTML events are “things” that happen to HTML elements. When JavaScript is used in HTML pages, JavaScript can “react” to these events.
- onchange
- onload
- onclick
- onmouseover
- onmouseout
- onkeydown
example:
<button onclick="this.innerHTML=Date()">The time is?</button>4. JS Operators
In JavaScript, there are various types of operators which is :
a). Arithmetic Operators
+ -----------(Addition)
- -----------(Subtract)
/ -----------(Divide)
* -----------(Multiply)
** -----------(Exponentiation)
% -----------(Modulus)
++ -----------(Increment)
-- -----------(Decrement)b). Assignment Operators
This will extract as if we have used “x+=y” then it’ll do “x=x+y”.
Opreator Example
= x = y
+= x += y
-= x -= y
*= x *= y
/= x /= y
%= x %= y
**= x **= yc). String Operators
We have a “+” operator for the concatenation of two strings.
let text1 = "Arun";
let text2 = "Kashyap";
let text3 = text1 + " " + text2;Output :
Arun Kashyap
d). Comparison Operators
Operator Description== equal to
=== equal value and equal type
!= not equal
!== not equal value or not equal type
> greater than
< less than
>= greater than or equal to
<= less than or equal to
? ternary operator
e). Logical Operators
Operator Description Example
&& AND 1==1 && 2==3 = false
|| OR 1==1 || 2==3 = true
! NOT !(1==1 && 2==3) = truef). Conditional Operators
This is one of the famous operators which is we most commonly use in ReactJS/JS.
condition ? statement1 : statement2 This operators have two statements, if our condition is true then it’ll execute the first statement else it’ll execute the last statement only.
5. JS Timing Function
We have a two-time function in JavaScript that is used to execute the function between or after the given time.
1. setTimeout(function, milliseconds)
2. setInterval(function, milliseconds)example :
const test = () => {
alert("Test Function");
}
setTimeout(test,10000);6. Callback Functions
A callback is a function passed as an argument to another function. This technique allows a function to call another function. A callback function can run after another function has finished. Basically, each function executes at the sequence(order) of its number.
Eg.:
<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
function myDisplayer(some) {
document.getElementById("demo").innerHTML = some;
}
function myFirst() {
myDisplayer("Hello");
}
function mySecond() {
myDisplayer("Goodbye");
}
mySecond();
myFirst();
</script>
</body>
</html>Here is the output of the code is :
HelloIf we remove myFirst function then it’ll print Goodbye.
7. JS Array Methods
These are the most important methods which are asked and used in programming. These methods we apply to the array. Where these methods determine which result we get at the end. we’ve various methods :
1. Array.map()
2. Array.filter()
3. Array.reduce()
4. Array.forEach()
5. Array.find()Let’s see an example of each method :
a). Array.map()
It is the most commonly used method which creates a new array with the previous array and displays items after executing statements.
let array = [1,2,3,4,5,6,7]
array.map(item => item*2)Output : [2, 4, 6, 8, 10, 12, 14]
b). Array.filter()
It is used to filter our array, which filters and gives us a new array of filtered items.
let array = [1,2,3,4,5,6,7]
array.filter(item => item > 5)Output : [6,7]
c). Array.reduce()
The reduce() the method executes a reducer function (that you provide) on each element of the array, resulting in a single output value.
SYNTEX : reduce((accumulator, currentValue, index(optional), array(optional)) => { ... } )Eg. :
let array = [1,2,3,4,5,6,7]
array.reduce((item,value) => item + value)Output : 28
d). Array.forEach()
The forEach() the method executes a provided function once for each array element.
let array = [1,2,3,4,5,6,7]
array.forEach((item)=> {
console.log(item)
})Output:
1
2
3
4
5
6
7
d). Array.find()
This method is used to find the value from the array then return the element(single). Although we’ve more elements it still returns one element.
let array = [1,2,3,4,5,6,7]
array.find(item=> item > 5)Output : 6
Apart from that, I’ve also more questions related to JS let me know if you like this and want to see some more.
These questions are only from JavaScript basics. In the next blog, we’ll learn EcmaScript interview Questions. Then we’ll see ReactJS basic to expert level questions.
let grow together…
