Variables
In TypeScript and ES2015, you have three choice for referencing a variable: var
, let
, and const
.
let
and const
are block-scoped.
var
is function-scoped.
// const and let only exist in the blocks they are defined in.
{
let a = 1;
const b = 1;
var c = 1
}
console.log(a); // ReferenceError
console.log(b); // ReferenceError
console.log(c); // 1
const
keyword
- Use
const
for all of your references; avoid usingvar
. eslint:prefer-const
,no-const-assign
Why? This ensures that you can't reassign your references, which can lead to bugs and difficult to comprehend code.
// bad
var a = 1;
var b = 2;
// good
const a = 1;
const b = 2;
// bad
superPower = new SuperPower();
// good
const superPower = new SuperPower();
- Use one
const
declaration per variable. eslint:one-var
jscs:disallowMultipleVarDecl
Why? It's easier to add new variable declarations this way, and you never have to worry about swapping out a
;
for a,
or introducing punctuation-only diffs.
// bad
const items = getItems(),
goSportsTeam = true,
dragonball = 'z';
// bad
// (compare to above, and try to spot the mistake)
const items = getItems(),
goSportsTeam = true;
dragonball = 'z';
// good
const items = getItems();
const goSportsTeam = true;
const dragonball = 'z';
- 13.3 Group all your
const
s and then group all yourlet
s.
Why? This is helpful when later on you might need to assign a variable depending on one of the previous assigned variables.
// bad
let i, len, dragonball,
items = getItems(),
goSportsTeam = true;
// bad
let i;
const items = getItems();
let dragonball;
const goSportsTeam = true;
let len;
// good
const goSportsTeam = true;
const items = getItems();
let dragonball;
let i;
let length;
- 13.4 Assign variables where you need them, but place them in a reasonable place.
Why?
let
andconst
are block scoped and not function scoped.
// bad - unnecessary function call
function checkName(hasName) {
const name = getName();
if (hasName === 'test') {
return false;
}
if (name === 'test') {
this.setName('');
return false;
}
return name;
}
// good
function checkName(hasName) {
if (hasName === 'test') {
return false;
}
const name = getName();
if (name === 'test') {
this.setName('');
return false;
}
return name;
}
let
keyword
- If you must reassign references, use
let
instead ofvar
. eslint:no-var
jscs:disallowVar
Why?
let
is block-scoped rather than function-scoped likevar
.
// bad
var count = 1;
if (true) {
count += 1;
}
// good, use the let.
let count = 1;
if (true) {
count += 1;
}
var
keyword
Before ES2015, var
is the only reference option.
- Avoid using
var
in later code because it would lead to unexpected results. - Use
var
if your application needs to be very sensitive on memory consumption. But most of the time this is not an issue