TypeScript Tutorial
TypeScript Arrays
An array is a list of values of one type. Index from 0. Annotate it as number[] or Array<number>.
A list under one name
An array holds several values of the same type in one variable. Four quiz scores do not needscore0, score1, score2, and score3. They belong in one array named scores.
Every slot has an index. The first slot is 0, not 1. The last slot of a four-element array is 3. That off-by-one rule is the source of most array bugs.
Declare and initialize
Annotate the type as number[] or as Array<number>. They mean the same thing. This course writes number[] in most examples. Then give a brace list of starting values.
Example
const scores: number[] = [88, 91, 74, 95];
console.log(scores[0]);
console.log(scores[3]);
console.log(scores.length);scores.length is the count of slots. You do not compute it with sizeof the way C++ does. The length is a property on the array. Unlike a C++ raw array, a TypeScript array can grow later withpush. This chapter stays with a list you filled at the start.
Index from zero
Read a slot with name[index]. Assign to a slot the same way. Changing scores[1] does not copy the array; it overwrites that one number.
| Index | Value in the example |
|---|---|
| 0 | 88 |
| 1 | 91 |
| 2 | 74 |
| 3 | 95 |
There is no useful scores[4] on a four-element array. Reading it gives undefined. Stay in 0 through length - 1.
Loop through the slots
A for loop with an index is the usual way to visit every element when you need the position. Keep the loop condition i < scores.length, not i <= scores.length.
Example
const temps: number[] = [16.0, 18.5, 21.0, 19.5, 17.0];
let total: number = 0;
for (let i: number = 0; i < temps.length; i = i + 1) {
total = total + temps[i];
}
console.log("average: " + total / temps.length);
temps[2] = 22.0;
console.log("midday: " + temps[2]);temps.length keeps the loop and the average in sync. Add a value later and you do not have to hunt down a separate count variable.
for-of when you only need the value
If you do not need the index, for...of is shorter. Each pass binds one element.
Example
const seats: Array<number> = [12, 8, 15];
console.log("slots: " + seats.length);
for (const n of seats) {
console.log(n);
}Array<number> is the same type as number[]. Pick one spelling and stick with it in a file.
Stay inside the array
Walking off the end does not crash the way C++ undefined behavior can. You get undefined, and then arithmetic on it becomes NaN. Count the slots. Loop with i < length.
A TypeScript array is not a fixed C++ buffer. You can push a fifth score onto a four-element list. Array methods such as push, map, and filter get their own chapter. For this chapter, a typed list is enough: one type, index from zero, length for the count.
Example
const scores: number[] = [6, 9, 4, 10, 7, 8];
let total: number = 0;
for (let i: number = 0; i < scores.length; i = i + 1) {
total += scores[i];
}
console.log("sum: " + total);
console.log("last: " + scores[scores.length - 1]);Next: group related values of different types with an object — TypeScript’s analog of a C++ struct.