JavaScript is an easy to learn programming language. 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 JavaScript code.
In this article, we’ll look at the best ways to work with objects and variables.
Use Bracket Notation When Accessing Properties with a Variable
We should use the bracket notation when we access properties with variables.
For instance, we can write:
const getVal = (prop) => {
return foo[prop];
}
const bar = getProp('jedi');
The code above has a getVal
function to pass prop
into the object foo
.
Use Exponentiation Operator When Calculating Exponentiations
Instead of using Math.pow
, we should use **
for exponentiation.
For instance, we can write:
const result = 2 ** 5;
instead of writing:
const result = Math.pow(2, 5);
Variables
There are some things to think about when we’re declaring JavaScript variables.
Always Use let or const to Declare Variables
We should always use let
or const
to declare variables.
Otherwise, we end up with global variables.
For instance, instead of writing:
foo = 1;
or:
var foo = 1;
We write:
let foo = 1;
or:
const bar = 2;
const
values can’t be reassigned but whatever is assigned is still mutable.
Use One const or let Declaration Per Variable or Assignment
We should declare variables all on their own line.
This way, we know the type of each variable exactly.
For instance, instead of writing:
const foo = 1, bar = 2;
We write:
const foo = 1;
const bar = 2;
Group All const and let Statements Together
Grouping them together makes reading them easier.
For instance, instead of writing:
let foo = 1;
const bar = 2;
let baz = 3;
const qux = 4;
We write:
let foo = 1;
let baz = 3;
const bar = 2;
const qux = 4;
Assign Variables Where we Need Them
We should assign variables close to where we need to use them.
This way, we don’t have to follow many lines of code to see where they’re used.
For instance, instead of writing:
let x = 1;
// 50 lines of code that doesn't change x ...
x = 2;
We write:
let x = 1;
// 5 lines of code that doesn't reference x...
x = 2;
Don’t Chain Variable Assignments
We shouldn’t chain variable assignments.
This is because we’ll create global variables out of it.
For instance, if we have:
let a = b = c = 2;
Then b
and c
are global variables.
So we should write:
let a = 2;
let b = a;
let c = a;
instead.
Avoid Using Increment or Decrement Operators
The increment and decrement operators both update the value and return them at the same time.
Depending on the placement of the operator, it may return the updated value or the old value.
If we place ++
or --
before the operand, then the new value is returned.
Otherwise, the old value is returned.
For instance, if we write:
let x = 1;
const y = ++x;
Then y
is 2 since the updated value of x
is returned.
On the other hand, if we write:
let x = 1;
const y = x++;
Then y
is 1 since the old value of x
is returned.
This also applies to --
Therefore, we should use the +=
and -=
operators instead and make the increment and decrement operators a statement.
For example, we can write:
x += 1;
or:
x -= 1
instead.
Avoid Line Breaks Before or After = in an Assignment
We can use parentheses to wrap a long JavaScript expression so that we can see what we’re assigning to a variable clearly.
For instance, instead of writing:
const foo =
longExpression;
We can write:
const foo = (
longExpression
);
Conclusion
We should always use let
or const
to declare variables.
Also, we should use +=
or -=
operators instead of ++
or --
for increment and decrement respectively.
If we have long expressions, we should wrap them in parentheses before assigning them.
We should use the dot notation as much as possible for accessing properties.