TypeScript is an easy to learn extension of JavaScript. It’s easy to write programs that run and does something. However, it’s hard to account for all the uses cases and write robust TypeScript code.
In this article, we’ll look at the best practices to following when writing code with TypeScript, including having consistent brace styles and spacing.
Also, we should have only one member with a given name in a class.
And we should also avoid the array constructor.
Useless parentheses should also b removed.
We Should Have Consistent Brace Styles
We should keep consistent brace styles for anything that needs to be wrapped in braces.
For instance, if we have an interface, we can write:
interface Foo {
name: string;
}
This also applies to classes, enums, type aliases, and any other blocks.
Have Consistent Commas Spacing
Comma spacing in parameter lists should be consistent.
For instance, we can write:
interface Foo {
foo(val: string, bar: string): string;
}
We have space after the comma in the list.
Default Parameters Should be the Last Parameter
We can place default parameters anywhere in the function signature in JavaScript.
Therefore, to be consistent, we should place them last so that we don’t have to look at the definition to know where they are.
For instance, instead of writing:
function f(a = 0, b: number) {}
We write:
function f(a, b: number = 0) {}
Remove Spacing Between Function Identifiers and their Invocations
We should remove spaces between function names and the opening parenthesis.
For instance, instead of writing:
alert ('hi');
We write:
alert('hi');
Have Consistent Indentation within Our Code
2 spaces for indentations is great because they’re the same in all operating systems.
We can save typing by converting tabs to 2 spaces.
Also, we should have a space between operands.
For instance, instead of writing:
if (a) {
b=c;
}
We write:
if (a) {
b = c;
}
Initialization in Variable Declarations
We can have initialization in variable declarations.
For instance, we can either write:
let x;
or:
let x = 1;
They’re both fine in our code.
Spacing Before and After Keywords
We should have space after most keywords.
For instance, we can put a space after if , for , while , do , else , switch , case , or new .
We can write:
if (bar) {
_// ..._
} else {
_// ..._
}
or:
for (const a of arr) {
//..
}
or:
while (foo){
//...
}
or:
do {
//...
} while (foo)
or:
switch (foo){
case 1: {
//...
break;
}
//...
}
One space makes our code more readable.
Don’t Use the Array Constructor
The Array constructor isn’t very useful.
Also, there are 2 versions of it.
If we pass in 1 argument, then we get an array with the number of empty entries we passed into the constructor.
On the other hand, if we pass in multiple arguments, then it returns an array with all the arguments we passed in.
To make our lives easier, we should use array literals.
For instance, instead of writing:”
const arr = Array(1);
or:
const arr = new Array(1);
or:
const arr = new Array(1, 2, 3);
We write:
const arr = [1, 2, 3];
No Duplicate Class Members
We shouldn’t have 2 class members with the same name since the 2nd one will overwrite the first one.
For instance, instead of writing:
class Foo {
bar() { return 1; }
bar() { return 2; }
}
We write:
class Foo {
bar() { return 1; }
}
or:
class Foo {
bar() { return 2; }
}
No Empty Functions
Empty functions are useless.
Therefore, we shouldn’t write them.
Instead of writing:
functuion foo(){}
We should remove it.
No Useless Parentheses
Some parentheses are useless and others are useful for separating code.
Some parentheses that are useless include:
for (const a in (b)){
//...
}
or:
for (const a of (b)){
//...
}
Instead, we should write:
for (const a in b){
//...
}
or:
for (const a of b){
//...
}
Also, the parentheses in typeof (a); isn’t very useful.
Instead, we should write typeof a;
Conclusion
We should have consistent spacing in our code.
Also, we shouldn’t have duplicate class members.
The array constructor should also be avoided.
Useless parentheses should also b removed.
