JavaScript Tricky Concept

Closures

Closures are a fundamental concept in JavaScript. When a function is able to remember and access its scope even when that function is execute outside its scope its closures.

React Hooks

Hook is a special function in React features. If a function component add some state to it, a Hook inside the existing function component. React Hooks are a new addition in React 16.8. It define without writing a class. Hooks define top of the function.

Its helps developer to write extra code. Its reduce complexity form code.

useState Hook

This hook use to set the value of a function and return that when that need. If any function change its state , then its work. Syntex is

Const [count, setCount] =useState(default); // count and setCount can be change.

useEffect Hook

Some times its need that, when a page load and load some data or fechares. Then use useEffect. Some times its depend some values .

Syntax..

useEffect(()=>{
},[]) // [] in this area set dependency

Some true and false rule

In if statement we set condition. From this table we can see which result is true or false.

1. If condition is age & value of age is 0, it returns false. And if age value is a number as like 1,2,3 etc its return true.

var age =12;
if(age){
console.log(“condition return true”); // result is this
}else {
console.log(“condition return true”);
}
var age =0;
if(age) console.log(“condition return true”);
else {
console.log(“condition return true”); // result is this
}

2. In JavaScript if statement count an empty is false. If a string has length or only white space its show true. If 0 in a string “0” is true in string.

var name=”mimi”;
if(name.length >0 || name)
console.log(“condition return true”); // result is this
}else {
console.log(“condition return true”);
}
var name=””;
if(name){
console.log(“condition return true”);
}else {
console.log(“condition return true”); // result is this
}

3. If any value is defined but not set value, it show undefined. It means false. If variable value set null, it means false.

Undefine Vs Null

Undefined

1. If variable has no value, its show undefined.

2. If function don’t return anything, its show undefine.

Function add(num1, num2){
Var sum =num1 + num2;
}
Let result = add(1,2);
Console.log(result); // output undefined

3. If function parameter is defied but don’t pass the value, its show undefined.

Function add(num1, num2){
Console.log(num2); // output undefined
}
Let result = add(1);

4. If any one access object property which is not assigned its show undefined.

Const person={name: “abc”, age:12}
Console.log(person.gender);

Null

1. null means empty.

2. If any one access array element which is not exit its show null.

Double and Triple equal

double equal always check only value. Never check the type of the value.

Var a=3; var b= “3”;
If(a == b)
{ consol.log(“condition true”);// show this for double equal
}
Else{
consol.log(“condition false”);
}

Triple equal always check value and type.

Var a=3; var b= “3”;
If(a == b)
{ consol.log(“condition true”);
}else
{ consol.log(“condition false”);// show this for double equal
}

Map, filter, find

The map() method creates a new array with the results of calling a function. It calls the provided function once for each element in an array. This method does not change the original array. map() method take 3 parameter (element, index, array).

var array = [2,3,4,5,6,7,8,9,10];
var squ =[];
squ = array.map(x => x*x);
console.log(squ);

filter() method find all value from an array which is searched.

var array = [2,3,4,5,6,7,8,9,10];
const filtering = array.filter(function(element){
return element>5;
});
console.log(“bigger then 5 :”, filtering);

find() method returns the value of the first element in an array which is searched. The function once for each element present in the array.

var array = [2,3,4,5,6,7,8,9,10];
const lessthen = array.find(x=> x<5);
console.log(lessthen);

This key word

this key word mention that which context is run that time.

const example = {
name: “mimi”,
func: function() {
return this.name;
},
};
console.log(example.func());
// expected output: mimi