Write less Javascript
Make your code look cleaner by writing less. You can achieve this by using so-called shorthand Javascript techniques. I've included a few that I use most frequently. 🙏
Empty, null & undefined checks
Before
let created;
if (date !== null || date !== undefined || date !== '') {
created = date;
} else {
created = 'Today';
}
After
const created = date || 'Today';
This was a major gamechanger for me. Use the OR operator to check if the date is empty, undefined or null before copying its value to the created variable. When it is empty you can state what you would like the value of the variable to be by declaring it after the OR operator.
One line if..else statements
Before
const type = 'Latte';
let isCoffee;
if (type === 'Latte') {
isCoffee = true;
} else {
isCoffee = false;
}
After
const type = 'Latte';
const isCoffee = type === 'Latte' ? true : false;
console.log(isCoffee);
// true
Write what you would normally write inside the IF parentheses, before the question mark. You can then write right after the question mark what you would like to return if the IF statement was true. Declare the else return value after the colon.
Inception alert, you can even do a nested one, here's an example:
const type = 'Latte';
const isIced = true';
const isCoffee = type === 'Latte' ? (isIced === true ? false : true) : false;
console.log(isCoffee);
// false
This statement checks if type equals to Latte, if so, check if isIced is true.
If this is the case, isCoffee becomes false because we all know that iced Latte is an abomination. 👽
I added parentheses to make it more clear but you can write this line without them.
Declaring multiple variables
Before
let x;
let y = 'Jason';
let z = 3;
After
let x, y='Jason', z=3;
Declare the variables in one line, it doesn't matter whether the variables are Strings, Integers or empty. Just make sure to include only the same variable declarations. You can do the same for const and var declarations.
Converting Strings into Numbers
Before
let num1 = parseInt("1337");
let num2 = parseFloat("13.37");
After
let num1 = +"1337";
let num2 = +"13.37";
You can use this technique to convert a String into an Integer or Double. The first line converts a String into an Integer while the second line converts it into a Double.
One line Function declaration
Before
function sendCongrats(name) {
console.log('Happy bday ' + name + '!');
}
After
sendCongrats = name => console.log('Happy bday ' + name + '!');
Use the arrow operator instead of writing long function declarations and parentheses. I use this for functions with simple tasks such as return or print out values to the console.
One line forEach statement
Before
names.forEach(function(name) {
console.log(name);
});
After
names.forEach(name => console.log(name));
Use the arrow operator for your forEach statments when you quickly want to quickly manage the values.
Initialize object properties
Before
var cat = 'Miaow';
var dog = 'Woof';
var bird = 'Peet peet';
var someObject = {
cat: cat,
dog: dog,
bird: bird
}
After
let cat = 'Miaow';
let dog = 'Woof';
let bird = 'Peet peet';
let someObject = {
cat,
dog,
bird
}
console.log(someObject);
//{
// cat: "Miaow",
// dog: "Woof",
// bird: "Peet peet"
//}
Save yourself some time by not typing the variable name 2 times.