Some Tricky Things of javascript.
Javascript has some tricky things. Sometimes they are confused us. That's an important need to learn every developer. And especially its help for good performance in the interview.lets start..
Javascript object method & what is bind call , apply ?
We know the object is data collection which stores multiple values under a property. We can use the method in object .we can calculate value execute by this method.
another thing is bind, call, apply. actually, that is a method and we can use that in the object.“bind()” method using for joining different objects that mean binding tow objects. This bind method takes an object as a parameter that you want to joining or binding with an object. After declaring the parameter you can be using any method which is existing in any object and also you can modify a value that is under an object property using an object method which you get after using the bind method.
const firstPerson = {
firstName: 'mahin',
lastName: 'Tazuar',
salary: 500,
fullName: function () {
return this.firstName + ' ' + this.lastName;
},
getBill: function (amount, tax) {
return this.salary - amount - tax;
},
};const person = {
firstName: 'Rakib',
lastName: 'Hasan',
salary: 2000,
};const getPerson = firstPerson.getBill.bind(person);
console.log(getPerson(100, 100)); //expacted output 1800
If you using bind method you need to call separately inside the method. But if you using the call method you do not need to call separately an method from inside this object. You can pass the value directly after calling the object name which you want to bind and, That value you need to pass what you calculate using this object method inside this object. Then after calculating this value and this method will return ta calculated the result.
const firstPerson = {
firstName: 'mahin',
lastName: 'Tazuar',
salary: 500,
fullName: function () {
return this.firstName + ' ' + this.lastName;
},
getBill: function (amount, tax) {
return this.salary - amount - tax;
},
};const person = {
firstName: 'Rakib',
lastName: 'Hasan',
salary: 2000,
};const getPerson1 = firstPerson.getBill.call(person, 200, 100);
const getPerson2 = firstPerson.getBill.apply(person, [200, 100]);
console.log(getPerson1)// if you use call , 1700
console.log(getPerson2)// if you use apply, 1700
“apply()” In this method, you need to use a different case. If you want to pass multiple values in a method. You can use the apply method. When you can use the apply method, you need to declare the object name which you want to bind with an object and after that, you need to give multiple values inside an array. That is the role of apply method.
“new” Key word
Javascript has a special reserve keyword whose name is “new”. In previously javascript create a template object using the class and contractor method. Then we can store this object in a variable but need to be declared a new keyword before the class name. Remember you need to pass the object value inside the class method which is created by class and object. Then we can create more and more object what we need using by this new keyword with a method.
Javascript variable scope
That is sometimes confused us. We know javascript using some separate reserved keyword for declaring variable. In previously using var keyword in javascript for declaring variables. But this variable has some bug because this variable can not properly maintain scope or block, that's why var variable conflict with another variable which created after declaring this variable. Then javascript solved this problem and bring const and let keyword. If we need to declare any constant value, need to declare const keyword in javascript and if we need changeable value we can use let keyword. They maintain a scope environment.
var str1 = "mahin";
const salary=500;
let age = 20;
function adds(){
age = 21;
let friend=6;
console.log(salary,age,friend)}//500 and 21,6
adds()Javascript this keyword
this is a special reserved keyword in javascript. What this is return by using it, that depends on the environment or were using this. If you used that in a method, this means his own object in this method. If you declare this alone or you do not use in anythings insides, this time this keyword returns a global object.If you use that in an event this time this is received the event doing the intersection what user want.
const obj = {
firstName: 'mahin',
lastName: 'Tazuar',
salary: 500,
fullName: function () {
return this.firstName + ' ' + this.lastName;
},
getBill: function (amount) {
return this.salary - amount;
},
};
console.log(obj.getBill(100));async await
We know javascript is a synchronize language. Synchronize means, javascript working serially if javascript has found one error then javascript working stop and return an error. So that async-await effective for that. if we use that for fetching with API then he working like a promise. So if we can not get value or error its does not break synchronizing. Because the async-await system waiting for a response when he got a response he executes that again and again. If got an error or something we can catch it by the catch error handling method.
async function loadData(){
const response = await fetch('https://jsonplaceholder.typicode.com/users')
const getData = await response.json();
console.log(getData,"store1"); // data
}
loadData()javascript breaking synchronizing
We know javascript synchronize language. Synchronize means javascript working with serially so that if he found any type of error javascript break in here. Javascript have some advantage to modify specifically. Javascript using setTimeout function, it takes two values like a parameter. First, need to give what it needs to be executing then give time. Time means how many times later execute that. Then after calling this function properly, we can see this function working selected times later, it executing and return the result. So that it brings out from synchronizing.
I want to introduce another function that is relevant with the setTimeout function.That is setInterval method.Its like loop when give all parameter like setTimeout method ,its return the value selected time latter and its continiuoslly executing and return the result.
function check(){
console.log(20095);
}
console.log(35356);setTimeout(check,1000)console.log(35356);
console.log(35356);setInterval(() => {
console.log('cleiked')
},2000 )console.log(35356);
console.log(35356);
Javascript null vrs undefined
null and undefined are primitive data types in javascript.null means blank values. I mean variable declared but there has no value. And undefined means this variable is not declared.
const values = null;
const str1;
console.log(valyes) // null
console.log(str1)//undefinedDouble EQUAL (==) VS Triple Equal (===)
Those are my favorite topics. If needed justify within two values and they are data types you need to try Triple equal if you need to justify this value is the same or not then you can go for double equal.
const nums= 6;
if( nums == 10 ){
console.log('this is same with 10)}elase {console.log(that is not same)}Truthy and falsy values
Javascript has some truthy and falsy values. So if we use this type values javascript considers that as truthy and falsy values.
some flase values and other all values ar true.
//false
//""
//undefined
//null
//NaN
const setValues = "";if(setValues){
console.log('this values is true');}
else {console.log('this values is false)} // expacted output is this //values is false
map vrs find vrs filter
Javascript has some functions for working with an array.
map using for return the all value of the array and find return first value with an object and conditionally from an array and filter give all value inside a object from an array with conditionally.