Перейти до основного вмісту
eLearner.app
Модуль 1 · Урок 2 із 22/14 у курсі~10 min
Модульні уроки (2/2)

Масиви та кортежі

In JavaScript, arrays can contain any type of elements and can grow or shrink dynamically. TypeScript adds static type checking to ensure collections remain homogeneous or respect a fixed type structure.


Arrays (Homogeneous Collections)

In TypeScript, there are two equivalent ways to define the type of an array containing elements of the same type:

  1. Using the element type followed by square brackets ([]):

    TS
    const numbers: number[] = [1, 2, 3];
    const strings: string[] = ['a', 'b', 'c'];
  2. Using the generic Array<T> type:

    TS
    const numbers: Array<number> = [1, 2, 3];

Both syntaxes are fully valid, but the first one (type[]) is the conventional and most common style. If you try to insert an invalid value (e.g. numbers.push("hello") on a number[] array), TypeScript will generate a compile-time error.


Tuples (Fixed-Length Arrays)

A tuple is a special type of array that has a fixed number of elements where each element has a predefined specific type based on its position.

For example, to store an HTTP response made of a status code (number) and a message (string):

TS
const response: [number, string] = [200, 'OK'];

In this case:

  • The first element (response[0]) must be a number.
  • The second element (response[1]) must be a string.
  • The array must be initialized with exactly 2 elements.

Read-Only Tuples (readonly)

An important detail about tuples in TypeScript is that at runtime they are normal JavaScript arrays. This means that mutative methods like .push() or .pop() are technically available and could alter the tuple length, partially bypassing type checks.

To prevent this behavior and enforce true immutability, we can use the readonly modifier:

TS
const point: readonly [number, number] = [10, 20];
// point.push(30); // Compile-time error!

Try it yourself

Exercise 1: Array of Numbers

вправи#ts.m1.l2.e1
Спроби: 0Завантаження…

Declare an array named scores that contains only numbers and is initialized with the values 90, 85, and 95. Use the explicit type annotation for the array. Do not use the any type.

Завантаження редактора…
Показати підказку

Use the syntax const scores: number[] = ... or Array<number>.

Рішення доступне після 3 спроб

Exercise 2: 3D Coordinate Tuple

вправи#ts.m1.l2.e2
Спроби: 0Завантаження…

Declare a tuple named point that represents a 3D coordinate (three numbers for X, Y, Z) and is initialized with the values 10, 20, 30. Use explicit type annotation.

Завантаження редактора…
Показати підказку

The tuple type must be [number, number, number].

Рішення доступне після 3 спроб

Exercise 3: Location Info Tuple

вправи#ts.m1.l2.e3
Спроби: 0Завантаження…

Declare a tuple named locationInfo that represents a geographic coordinate with its name. It must contain: latitude (number), longitude (number) and the city name (string). Initialize it with the values 41.9028, 12.4964, and 'Rome'.

Завантаження редактора…
Показати підказку

Use the syntax to define a tuple with three elements: [number, number, string].

Рішення доступне після 3 спроб

Exercise 4: Log Entry Tuple

вправи#ts.m1.l2.e4
Спроби: 0Завантаження…

Declare a tuple named logEntry representing a log line. It must contain in order: a timestamp (number), a severity level (string), and an error message (string). Initialize it with timestamp 1716300000, level 'INFO', and message 'Application started'.

Завантаження редактора…
Показати підказку

Use the syntax to define a three-element tuple: [number, string, string] and assign the specified values.

Рішення доступне після 3 спроб