RahulThere are many ways to write code but generally the first way for many people is very long and can take you some time. Here is my latest post that will increase your efficiency and productivity when coding JavaScript.
600+ Free Design resources
Resources. Freebies. Learn.
We're making things easier on Internet.
Visit - 600+ free design resources
JavaScript : Tricks You Should Know
The ternary operator
Noobs:
let hungry = true;
let eat;
if (hungry == true) {
eat = 'yes';
} else {
eat = 'no';
}
Pro:
let hungry = true;
let eat = hungry == true ? 'yes' : 'no';
Number to string / string to number
Noobs:
let num = 15;
let s = num.toString(); // number to string
let n = Number(s); // string to number
Pro:
let num = 15;
let s = num + ""; // number to string
let n = +s; // string to number
Populating an array
Noobs:
for(let i=0; i < arraySize; i++){
filledArray[i] {'hello' : 'goodbye'};
}
Pro:
let filledArray = new Array(arraysize).fill(null).map(()=> ({'hello' : 'goodbye'}));
Dynamic properties in objects
Noobs:
let dynamic = "value";
let user = {
id: 1,
};
user[dynamic] = "other value";
Pro:
let dynamic = "value";
let user = {
id: 1,
[dynamic] = "other value"
};
Read more => 3 Steps to learn a programming language
Removing duplicates
Noob:
let array = [100, 23, 23, 23, 23, 67, 45];
let outputArray = [];
let flag = false;
for (j = 0; < array.length; j++) {
for (k = 0; k < outputArray.length; k++) {
if (array[j] == outputArray[k]) {
flag = true;
}
}
if (flag == false) {
outputArray.push(array[j]);
}
flag = false;
}
//outputArray = [100, 23, 67, 45]
Pro:
let array = [100, 23, 23, 23, 23, 67, 45];
let outputArray = Array.from(new Set(array));
//outputArray = [100, 23, 67, 45]
Array to object
Noob:
let arr = ["value1", "value2", "value3"];
let arrObject = {};
for (let i = 0; i < arr.length; ++i) {
if (arr[i] !== undefined) {
arrObject[i] = arr[i];
}
}
Pro:
let arr = ["value1", "value2", "value3"];
let arrObject = {...arr};
Read more => A guide to Geolocation API
Object to Array
Noob:
let number = {
one: 1,
two: 2,
};
let keys = [];
for (let numbers in numbers) {
if (number.hasOwnProperty(number)) {
keys.push(number);
}
}
// key = [ 'one', 'two' ]
Pro:
let number = {
one: 1,
two: 2,
};
let key = Object.keys(numbers); // key = [ 'one', 'two' ]
let value = Object.values(numbers); // value = [ 1, 2 ]
let entry = Object.entries(numbers); // entry = [['one' : 1], ['two' : 2]]
Short circuit conditionals
Noob:
if (docs) {
goToDocs();
}
Pro:
docs && goToDocs()
Read more => "use strict" in JavaScript
Use ^ to check if numbers are not equal
if(a!=123) // before // NOOBS
if(a^123) // after // PRO
Loop over an object
const age = {
Rahul: 20,
max: 16
};
// Solution 1 - Get 'keys' and loop over
const keys = Object.keys(age);
keys.forEach(key => age[key]++);
console.log(age); // { Rahul: 21, max: 16 }
// Solution 2 - for ..in loop
for(let key in age){
age[key]++;
}
console.log(age); // { Rahul: 22, max: 18 }
Object keys are stored in insertion order
cosnt obj = {
name: "Rahul",
age: 16,
address: "Earth",
profession: "Developer",
};
console.log(Object.keys(obj)); // name, age, address, profession
Check if value is an array
const arr = [1, 2, 3];
console.log(typeof arr); // object
console.log(Array.isArray(arr)); // true
Initialize an array of size n and fill with default values
const size = 5;
const defaultValue = 0;
const arr = Array(size).fill(defaultValue);
console.log(arr); // [0, 0, 0, 0, 0]
Truthy and False values
False values => false, 0, ""(empty string), null, undefined, &NaN.
Truthy values => "Values", "0", {}(empty object), &[](empty array)
Difference between double equal and triple equal
// Double equal - Converts both the operands to the same type and then comapares
console.log(0 == 'o'); // true
// Triple Equal - Does not convert t same type
console.log(0 === '0'); // false
Better way to accept arguments
function downloadData(url, resourceId, searchTest, pageNo, limit) {}
downloadData(...); // need to remember the order
Simpler way to do:
function downloadData(
{ url, resourceId, searchTest, pageNo, limit } = {}
) {}
downloadData(
{ resourceId: 2, url: "/posts", searchText: "WebDev" }
);
null vs undefined
null => It is a value whereas undefined is not.
null is like an empty box and undefined it not box at all.
const fn = (x = 'default value') => console.log(x);
fn(undefined); // default value
fn(); // default value
fn(null); // null
When null is passed, the default value is not taken. Whereas, when undefined or nothing is passed the default value is taken.
Need Help
Need help in raising fund to buy a Mechanical Keyboard. This pandemic has affected my family badly so can't ask my DAD for it. Please Help Me.
⚡Thanks For Reading | Happy Coding 🍺
