Space of React

TypeScript для начинающих

0/23

Упражнение: Void — TypeScript для начинающих | Max Roslow | Space of React

Counter.tsx

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
import { useState } from 'react';
 
// Счётчик кликов
export function Counter() {
  const [count, setCount] = useState(0);
 
  return (
    <button onClick={() => setCount(count + 1)}>
      Кликов: {count}
    </button>
  );
}
 
// TODO: добавьте сброс счётчика
function reset() {
  setCount(0);
}

требуется вход

Войдите, чтобы решать задание

Онлайн-редактор кода, разбор решения и отметки о прогрессе доступны после входа.

Войти Создать аккаунт — бесплатно

Задание

void

void это тип результата функции, которая ничего не возвращает. Он говорит вызывающему коду: значение не приходит, использовать его нельзя.

В задании тип функции обещает строку:

export type Logger = (message: string) => string;

export const log: Logger = (message) => {
  console.log(message);
};

Компилятор ругается на присваивание: функция обязана вернуть string, а в теле только вызов console.log и никакого return. Сам console.log возвращает undefined, строкой это не является.

По смыслу логгер и не должен ничего возвращать: он пишет сообщение и на этом всё. Значит проблема не в теле функции, а в описании типа.

Стоит различать void и undefined. undefined это конкретное значение, а void означает «результат не предназначен для использования». Функцию, возвращающую что угодно, можно присвоить типу с void: лишний результат просто игнорируется. Обратное не работает.

Подробнее: Functions: void — справочник TypeScript.

Задание

Опиши тип Logger так, чтобы он описывал функцию, принимающую строку message и не возвращающую значения. Тело log менять не нужно.