Array

Array in JavaScript is a high-level, list-like objects.

Array creation

Should use literal syntax for array creation.

// bad
const items = new Array<string>()

// good
const items: string[] = []
const items = ['a', 'b', 'c']

May not need to do let x: any[] = [].

Why?

With both noImplicitAny and strictNullChecks turned on, TypeScript can do a better control flow analysis and default x to be any[].

Type declaration

Should use Array<T> for complex array type. May use literal syntax for primitive types and unions.

// bad
const items: Array<string>
const items: { people: Person[] }[]

// either is fine
const items: (string | string[])[]
const items: Array<string | string[]>

// good
const items: string[]
const items: Array<{ people: Person[] }>

Why?

The Array<> syntax is visually clear that your type is an array. It also provides better focus on the internal type.

Inserting

Must use .push() or .unshift() to add items to an array.

const someStack = [];

// bad
someStack[someStack.length] = 'abracadabra';

// good
someStack.push('abracadabra');

Why?

Use direct assignment to add items at the end of an array is unconventional. It hinders readability.

Array spread

Should use array spread to copy arrays.

// bad
const len = items.length;
const itemsCopy = [];
let i;

for (i = 0; i < len; i++) {
  itemsCopy[i] = items[i];
}

// good
const itemsCopy = [...items];

Why?

It is easier to read, and there is a performance gain 😎!.

Performance comparison: https://jsperf.com/spread-vs-copy


Should use array spread to concat arrays.

// bad
a.concat(b)

// good
[...a, ...b]

Why?

It is easier to read, and there is a performance gain 😎!.

Performance comparison: https://jsperf.com/spread-vs-concat-vs-push

(use .push() if you really need the performance).

Additional references:

results matching ""

    No results matching ""