Типизация массивов — важная часть работы с TypeScript. Существует два эквивалентных синтаксиса: number[] и Array — оба указывают на массив чисел.
На этом практическом уроке вы изучите:
- Объявление типизированных массивов обоими способами
- Работу с массивами примитивов
- Типизацию пустых массивов
Интерактивные задания и примеры помогут понять, как TypeScript контролирует содержимое массивов и предотвращает ошибки на этапе разработки.
- Модуль 1: Введение в TypeScript
- Модуль 2: Примитивные типы
- Модуль 3: Специальные типы
- Модуль 4: Массивы
- Типизация массивов (Type[]).
- Типизация массивов (Array).
- Массивы с несколькими типами.
- Readonly массивы.
- Модуль 5: Кортежи (Tuples)
- Модуль 6: Объекты
- Модуль 7: Функции
- Модуль 8: Union типы
- Модуль 9: Литеральные типы
- Модуль 10: Type Aliases
- Модуль 11: Интерфейсы
- Модуль 12: Type Guards и Narrowing
- Модуль 13: Enums
- Модуль 14: Классы
- Модуль 15: Generics — основы
- Модуль 16: Generics — ограничения
- Модуль 17: Utility Types — базовые
- Модуль 18: Utility Types — работа с Union
- Модуль 19: Utility Types — функции
- Модуль 20: Type Assertions
- Модуль 21: Keyof и Typeof операторы
- Модуль 22: Mapped Types
- Модуль 23: Conditional Types
- Модуль 24: Discriminated Unions
- Модуль 25: Модули и типы
- Модуль 26: Declaration Files
- Модуль 27: Типизация асинхронного кода
- Модуль 28: Практические паттерны
1. Типизация массива
В этом фрагменте кода на TypeScript объявляются три массива с разными типами данных. Заполните пропуски, указав правильные типы массивов, чтобы код был корректно типизирован. Обратите внимание на значения, которые содержатся в каждом массиве, чтобы определить тип его элементов. Используйте синтаксис TypeScript для типизации массивов.
let numbers: input1S = [1, 2, 3];
let strings: input2S = ["a", "b", "c"];
let booleans: input3S = [true, false, true];
console.log(numbers);
console.log(strings);
console.log(booleans);2. Эквивалентные записи массивов
В левой колонке приведены типы массивов в нотации T[] (например, string[]), а в правой — эквивалентные типы в нотации Array
string[]number[]boolean[](string | number)[]any[]never[]Array<string | number>Array<boolean>Array<never>Array<number>Array<string>Array<any>3. Ошибка типизации массива
В этом фрагменте TypeScript-кода допущена одна ошибка типизации массива. Массив объявлен как содержащий только числа, но в него пытаются добавить строку. Найдите и исправьте строку с ошибкой, чтобы код успешно компилировался и выполнялся.
let numbers: number[] = [1, 2, 3];numbers.push(4);numbers.push("5");console.log(numbers);4. Сборка кода с массивом
Из предложенных строк соберите корректную TypeScript-программу, которая создаёт типизированный массив чисел, добавляет в него два числа (1 и 2) в указанном порядке и выводит длину массива. Игнорируйте лишние строки, содержащие синтаксические ошибки или несоответствие типов.
let numbers: number[] = [];numbers.push(1);numbers.push(2);console.log(numbers.length);let numbers = [];numbers.push('a');numbers.push(35. Длина массива после операций
В приведённом фрагменте кода на TypeScript создаётся массив с начальными элементами, затем выполняются операции добавления и удаления элементов с помощью методов push() и pop(). Определите, какое значение будет выведено в консоль (длина массива после всех операций). Введите одно число без дополнительных символов.
let fruits: string[] = ['apple', 'banana'];
fruits.push('orange');
fruits.push('grape');
fruits.pop();
fruits.push('kiwi');
console.log(fruits.length);6. Выбор типа массива
В данном фрагменте кода TypeScript объявлены три переменные, которые инициализированы массивами разных типов. Выберите из выпадающего списка подходящий тип для каждой переменной, чтобы код был типобезопасным. Обратите внимание, что для массива строк допустимы два варианта записи типа.
let fruits: input1S = ["apple", "banana", "orange"];
let ages: input2S = [25, 30, 35];
let flags: input3S = [true, false, true];7. Поиск массивов в коде
Внимательно изучите приведённый ниже фрагмент кода на TypeScript. В нём объявлены переменные разных типов: массивы, строки, числа, объекты. Ваша задача — найти и выделить кликом все объявления массивов. Не отмечайте объявления переменных других типов (строк, чисел, объектов). Обратите внимание, что массивы могут быть объявлены с использованием синтаксиса `тип[]` или `Array<тип>`.
{{let numbers: number[] = [1, 2, 3];~|~t1}}
{{let userName: string = "Alex";~|~t2}}
{{let matrix: number[][] = [[1,2], [3,4]];~|~t3}}
{{let age: number = 25;~|~t4}}
{{let fruits: Array = ["apple", "banana"];~|~t5}}
{{let person: {name: string} = {name: "John"};~|~t6}}
{{let flags: boolean[] = [true, false, true];~|~t7}}
{{let score: number = 100;~|~t8}} 8. Этапы работы с массивом
Перед вами строки TypeScript-кода, описывающие основные этапы работы с типизированным массивом. Строки перемешаны. Расставьте их в логически правильном порядке, который отражает последовательность действий: от объявления типа массива до итерации по его элементам. Убедитесь, что код будет корректно выполняться в указанном порядке.
let firstElement = numbers[0]; // доступ по индексуlet numbers: number[] = [1, 2, 3]; // инициализация массиваfor (let num of numbers) { console.log(num); } // итерация по массивуnumbers.push(4); // добавление элемента// Объявление типа для массива чисел// Тип number[] означает массив чисел