Деструктуризация кортежей

Часть раздела Введение в TypeScript путешествия по JavaScript на Coddy — урок 17 из 73.

Хотя доступ к элементам кортежа по индексу работает отлично, существует еще более элегантный способ извлечения значений из кортежей: деструктуризация. Эта функция JavaScript бесшовно работает с типизированными кортежами TypeScript, позволяя распаковывать значения кортежа в отдельные переменные одной строкой.

Деструктуризация массива использует квадратные скобки в левой части присваивания для создания новых переменных, соответствующих каждой позиции в кортеже:

let userInfo: [number, string] = [42, "Alice"];
let [id, name] = userInfo;

console.log(id);   // 42 (TypeScript знает, что это число)
console.log(name); // "Alice" (TypeScript знает, что это строка)

Проверьте себя

В этом уроке есть небольшой тест. Начните урок, чтобы ответить на вопросы и сохранить прогресс.

Проверьте себя

В этом уроке есть небольшой тест. Начните урок, чтобы ответить на вопросы и сохранить прогресс.

Проверьте себя

В этом уроке есть небольшой тест. Начните урок, чтобы ответить на вопросы и сохранить прогресс.

Задание

Легко

Создайте кортеж с именем employee, который содержит число (ID сотрудника), за которым следует строка (имя сотрудника). Инициализируйте его с ID 1001 и именем "Sarah Johnson".

Используйте деструктуризацию, чтобы извлечь значения из кортежа employee в две отдельные переменные с именами empId и empName.

Создайте еще один кортеж с именем coordinates, который содержит два числа, представляющих координаты широты и долготы. Инициализируйте его значениями 40.7128 и -74.0060.

Используйте деструктуризацию, чтобы извлечь значения из кортежа location в две отдельные переменные с именами latitude и longitude.

Выведите деструктурированные переменные в следующем порядке, каждую на отдельной строке:

Выведите ID сотрудника
Выведите имя сотрудника
Выведите широту
Выведите долготу

Шпаргалка

Деструктуризация позволяет извлекать значения из кортежей в отдельные переменные в одну строку, используя квадратные скобки:

let userInfo: [number, string] = [42, "Alice"];
let [id, name] = userInfo;

console.log(id);   // 42 (TypeScript знает, что это число)
console.log(name); // "Alice" (TypeScript знает, что это строка)

TypeScript сохраняет информацию о типе для каждой деструктурированной переменной на основе определения типа кортежа.

Попробуйте сами

// TODO: Напишите свой код здесь
// Создайте кортеж сотрудника с ID 1001 и именем "Sarah Johnson"
// Используйте деструктуризацию для извлечения empId и empName
// Создайте кортеж координат со значениями 40.7128 и -74.0060 (избегайте использования 'location' в качестве имени переменной)
// Используйте деструктуризацию для извлечения latitude и longitude
// Выведите все четыре переменные в указанном порядке

// Выведите результаты (раскомментируйте и измените при необходимости)
// console.log(empId);
// console.log(empName);
// console.log(latitude);
// console.log(longitude);

Проверьте себя

В этом уроке есть небольшой тест. Начните урок, чтобы ответить на вопросы и сохранить прогресс.