JavaScript Fundamental concept if skip may be killing you
1. What is React Hook?
React hook is a function, but it's not a normal function, so it is a special type of function.
2. How Actually React Hook Works?
React hook has a lot of facilities. Basically react hook creates a relation with the react component. Basically react hook is used for data passing likes when we declared useState() hook and that’s time this functions under we can passing object, array, string, null, etc. When we think our data possible to change that's time we use useState(). This useState() return two value like
const [data, setData] = useState();
Here data is the initial value and setData is the updated value. That’s why it's called a hook. React have a lot of hook functions but they work another way.
3. What is bind()?
The main thing of the bind method is when we have an object and we have a function into the object and this function we can access out of the object. if we want to use this function or we want to attach another function with this object under functions that’s time we use the same like this…
const normalPerson = {
name: ‘Ariful Islam’,
salary: 10000,
getName: function(){
console.log(this.name);
},
chargeBill: function(amount){
console.log(this)
this.salary = this.salary — amount;
return this.salary;
}
}
const heroChargeBill = {
name: ‘Shofiq’,
salary: 25000,
}
normalPerson.chargeBill()
const personChargeBill = normalPerson.chargeBill.bind(heroChargeBill);
personChargeBill(1000)
Here we have a function in object, after we create a function out of the object. First of this we called class under chargeBill() after we replace chargeBill() by using bind() and send parameter our second function. Finally bind function return a new function and this function we send a parameter.
Expected Output:
{
name: ‘Ariful Islam’,
salary: 10000,
getName: [Function: getName],
chargeBill: [Function: chargeBill]
}
{ name: ‘Shofiq’, salary: 25000 };
4. Difference Between call and apply
Before starting the difference between call and apply please see the example value…
I use here the previous example:
const normalPerson = {
name: ‘Ariful Islam’,
salary: 10000,
getName: function(){
console.log(this.name);
},
chargeBill: function(amount){
console.log(this)
this.salary = this.salary — amount;
return this.salary;
}
}
const heroChargeBill = {
name: ‘Shofiq’,
salary: 25000,
}
normalPerson.chargeBill.call(heroChargeBill, 100)
console.log(heroChargeBill.salary);
Expected Output:
{ name: ‘Shofiq’, salary: 25000 }
24900
Here first I call object under function and use call method with sending two parameters (heroChargeBill, 100) here heroChargeBill is the value of this keyword and 100 is the value of amount. If I want to send parameters into the function that’s time we will send one or more parameters.
apply()
normalPerson.chargeBill.apply(heroChargeBill, [500]);
Expected Output:
{ name: ‘Shofiq’, salary: 25000 }
24500
Finally, the main difference is to apply and call are call function take first thisArgument value and one or more value, and another hand apply function take first thisArgument value and one or more array value.
5. Local Variable VS Global Variable
The main thing of a local variable and global variables is very simple. When we declare a variable into the function that called a local variable other hand when we are declaring a variable out of the function that’s the time it's called a global function.
For Example:
let name = ‘Ariful islam’;
const myName = () => {
myNameIs = ‘Ariful Islam’;
}
Here name is global variables and myNameIs local variables.
6. Why use new keyword?
The main thing of the new keyword if we have a class and we want to create an object from the class that’s time we use new keyword.
For Example:
class Person{
constructor(firstName, lastName){
this.firstName = firstName;
this.lastName = lastName;
}
}
const newPerson = new Person(‘Ariful’, ‘Islam’);
console.log(newPerson)
Expected Output:
Person { firstName: ‘Ariful’, lastName: ‘Islam’ }
7. Why use this keyword?
Basically when we are declaring this keyword into the function or class and that’s time this keyword represents that object or class.
8. Truthy VS Falsy values
For see the best please see the below code…
const age = 4;
if(age){
console.log(‘Condition is True’)
}else{
console.log(‘Condition is False’)
}
Here I declare age = 4 which means if the value has in a variable that’s time he checks and goes to true otherwise it would be false.
9. Double Equal VS Triple Equal
The main difference is that double equal and triple equal is very simple. Double equal check only values, if the value is equal and that's the time it would be true. other hand triple equal check value and data type.
10. Null VS Undefined
The main things of null vs undefined are very simple. if a variable declares but the value not assigned it would be output undefined. if we initially declare into variable null so it would be result null.