Void typescript что это

TypeScript: Тип Void

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

Использование типа Void

void автоматически выводится, когда внутри функции нет инструкции return или она пустая:

function noop() < // внутри пусто >

В JavaScript подобные функции возвращают undefined , но в TypeScript void и undefined — это разные вещи. Они различаются по контекстной типизации. А происходит это из-за особенностей работы самого JavaScript. Самый яркий пример — метод forEach() .

Метод forEach() не использует данные, возвращаемые переданным колбеком, который вызывается внутри. Возможно, логично было бы определить возврат как undefined , но посмотрим на пример:

const numbers = [1, 2, 3]; const result = []; numbers.forEach((n) => result.push(n)); 

Метод push() возвращает новую длину массива. Если бы forEach() требовал от колбека возврат undefined , то такой код привел бы к ошибке компиляции. Его пришлось бы переписать, например, так:

// Теперь колбек ничего не возвращает, // соответственно, результат вызова undefined numbers.forEach((n) => < result.push(n); >); 

Чтобы не писать такой код, и был введен void . Он позволяет возвращать любые данные, но делает так, что их использование бессмысленно.

Мы можем определить тип функции, который возвращает void , и использовать его для типизации переменной:

type VoidFunc = () => void; // Тип функции определяется через контекст // присваивания ее переменной с типом VoidFunc const f: VoidFunc = () => true; const v = f(); 

Хотя f() возвращает true , переменная v имеет тип void . Это означает, что мы не можем использовать ее для чего-либо, кроме как для присваивания другой переменной с типом void .

Существует единственная ситуация, когда указание void явно запрещает возврат из функции. Это определение функции вне контекста использования, когда ее тип указывается явно:

function foo(): void < return true; // Error! >const bar = function(): void < return true; // Error! >; 

В этом случае возврат любого значения приведет к ошибке компиляции.

Также void является оператором JavaScript, поэтому важно не запутаться с ним. Он вычисляет выражение, которое следует за ним и возвращает undefined :

void 10 === undefined // true 

Задание

Попробуйте самостоятельно определить функцию forEach() для чисел:

forEach([1, 2, 3], (n) => console.log(n)); // 1 // 2 // 3 const result = []; forEach([1, 2, 3], (n) => result.push(n)); // [1, 2, 3] 

1. Массив чисел
2. Анонимная функция, которая принимает на вход число и возвращает void . У этой функции есть необязательный параметр — индекс элемента в массиве

forEach([8, 9], (n, index) => console.log(index + n)); // 8 // 10 

Упражнение не проходит проверку — что делать? ��

Если вы зашли в тупик, то самое время задать вопрос в «Обсуждениях». Как правильно задать вопрос:

• Обязательно приложите вывод тестов, без него практически невозможно понять что не так, даже если вы покажете свой код. Программисты плохо исполняют код в голове, но по полученной ошибке почти всегда понятно, куда смотреть.

В моей среде код работает, а здесь нет ��

Тесты устроены таким образом, что они проверяют решение разными способами и на разных данных. Часто решение работает с одними входными данными, но не работает с другими. Чтобы разобраться с этим моментом, изучите вкладку «Тесты» и внимательно посмотрите на вывод ошибок, в котором есть подсказки.

Мой код отличается от решения учителя ��

Это нормально ��, в программировании одну задачу можно выполнить множеством способов. Если ваш код прошел проверку, то он соответствует условиям задачи.

В редких случаях бывает, что решение подогнано под тесты, но это видно сразу.

Прочитал урок — ничего не понятно ��

Создавать обучающие материалы, понятные для всех без исключения, довольно сложно. Мы очень стараемся, но всегда есть что улучшать. Если вы встретили материал, который вам непонятен, опишите проблему в «Обсуждениях». Идеально, если вы сформулируете непонятные моменты в виде вопросов. Обычно нам нужно несколько дней для внесения правок.

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

Полезное

• Официальная документация
• void в TypeScript и JavaScript

Заметка о void в JavaScript и TypeScript

Если вы, до того, как заинтересовались JavaScript, писали на традиционных языках с сильной типизацией, то вы, возможно, знакомы с концепцией void . Это — тип, использование которого сообщает программисту о том, что соответствующие функции и методы при их вызове ничего не возвращают.

Сущность void имеется также в JavaScript и TypeScript. В JS это — оператор. В TS это примитивный тип данных. И там и там void ведёт себя не так, как могли бы ожидать многие из тех, кто сталкивался с void в других языках.

Оператор void в JavaScript

В JavaScript оператор void вычисляет переданное ему выражение. При этом, независимо от того, какое именно выражение вычисляется, void всегда возвращает undefined .

let i = void 2; // i === undefined

Зачем вообще нужен подобный оператор?
Во-первых, надо отметить, что в ранние годы JS-программирования разработчики могли переопределять undefined и записывать в него какое-нибудь своё значение. А вот void всегда возвращает настоящее значение undefined .

Во-вторых — использование оператора void — это интересный способ работы с немедленно вызываемыми функциями:

void function() < console.log('What') >()

И всё это — без загрязнения глобального пространства имён:

void function aRecursion(i) < if(i >0) < console.log(i--) aRecursion(i) >>(3) console.log(typeof aRecursion) // undefined

Так как оператор void всегда возвращает undefined и всегда вычисляет переданное ему выражение, в нашем распоряжении оказывается весьма выразительный способ возвращения из функции без возврата какого-то значения, но с вызовом, например, некоего коллбэка:

// возврат чего-то кроме undefined приведёт к аварийной остановке приложения function middleware(nextCallback) < if(conditionApplies()) < return void nextCallback(); >>

Это приводит нас к самому важному способу использования void . Данный оператор представляет собой нечто вроде «поста охраны» приложения. Если некая функция всегда должна возвращать undefined — обеспечить это можно, воспользовавшись оператором void .

button.onclick = () => void doSomething();

Тип данных void в TypeScript

Тип void в TypeScript можно назвать чем-то вроде противоположности типа any . Функции в JavaScript всегда что-то возвращают. Это может быть либо некое заданное программистом значение, либо undefined :

function iHaveNoReturnValue(i) < console.log(i) >// возвращает undefined

Так как JavaScript функции, из которых явным образом ничего не возвращается, всегда возвращают undefined , void в TypeScript является подходящим типом, сообщающим разработчикам о том, что функция возвращает undefined :

declare function iHaveNoReturnValue(i: number): void

Сущность void в виде типа можно ещё использовать для параметров и для любых других объявлений переменных. Единственное значение, которое всегда можно передать void-параметру — это undefined .

declare function iTakeNoParameters(x: void): void iTakeNoParameters() // ОК iTakeNoParameters(undefined) // ОК iTakeNoParameters(void 2) // ОК

В результате оказывается, что в TS типы void и undefined — это почти одно и то же. Но между ними есть одно маленькое различие, которое, на самом деле, чрезвычайно важно. Возвращаемый тип void может быть заменён на другие типы, что позволяет реализовывать продвинутые паттерны работы с коллбэками.

function doSomething(callback: () => void) < let c = callback() //здесь callback всегда возвращает undefined //тип c - тоже undefined >// эта функция возвращает число function aNumberCallback(): number < return 2; >// работает; обеспечивается типобезопасность в doSometing doSomething(aNumberCallback)

Разработчики ожидают от подобных конструкций, часто используемых в JS-приложениях, именно такого поведения. Вот материал на эту тему.

Если вы хотите, чтобы функция принимала бы лишь функции, которые возвращают undefined — вы можете соответствующим образом изменить сигнатуру метода:

// было // function doSomething(callback: () => void) < // стало function doSomething(callback: () =>undefined) < /* . */ >function aNumberCallback(): number < return 2; >// Ошибка - типы не совпадают doSomething(aNumberCallback)

Итоги

Оператор void в JavaScript и тип данных void в TypeScript — сущности довольно простые и понятные. Круг ситуаций, в которых они применимы, ограничен. Однако надо отметить, что программист, который их использует, скорее всего, не столкнётся при работе с ними с какими-то проблемами.

Уважаемые читатели! Пользуетесь ли вы void в JS и TS?

void operator

Оператор void вычисляет переданное выражение и возвращает undefined .

Синтаксис

void expression

Описание

Этот оператор позволяет вставлять выражения, которые производят дополнительные действия, в места, где ожидается undefined .

Оператор void часто используется для получения примитивного значения undefined , используя «void(0)» (что эквивалентно «void 0» ). В подобных случаях можно просто использовать глобальную переменную undefined (предполагая, что её значение по умолчанию не было изменено).

Самовызывающаяся функция (IIFE)

С оператором void можно использовать самовызывающиеся функции.

void (function iife()  var bar = function () >; var baz = function () >; var foo = function ()  bar(); baz(); >; var biz = function () >; foo(); biz(); >)(); 

JavaScript URIs

Когда браузер переходит по javascript: URI , он вычисляет код в URI и заменяет содержание страницы возвращённым значением, если оно не равно undefined . Можно воспользоваться оператором void для возврата undefined . Например:

a href="javascript:void(0);">Click here to do nothinga> a href="javascript:void(document.body.style.backgroundColor='green');"> Click here for green background a> 

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

Спецификации

Specification
ECMAScript Language Specification # sec-void-operator

Совместимость с браузерами

BCD tables only load in the browser

Смотрите также

Found a content problem with this page?

• Edit the page on GitHub.
• Report the content issue.
• View the source on GitHub.

This page was last modified on 7 авг. 2023 г. by MDN contributors.

Your blueprint for a better internet.

Заметка о void в JavaScript и TypeScript

Если вы, до того, как заинтересовались JavaScript, писали на традиционных языках с сильной типизацией, то вы, возможно, знакомы с концепцией void . Это — тип, использование которого сообщает программисту о том, что соответствующие функции и методы при их вызове ничего не возвращают.

Сущность void имеется также в JavaScript и TypeScript. В JS это — оператор. В TS это примитивный тип данных. И там и там void ведёт себя не так, как могли бы ожидать многие из тех, кто сталкивался с void в других языках.

Оператор void в JavaScript

В JavaScript оператор void вычисляет переданное ему выражение. При этом, независимо от того, какое именно выражение вычисляется, void всегда возвращает undefined .

let i = void 2; // i === undefined

Зачем вообще нужен подобный оператор?
Во-первых, надо отметить, что в ранние годы JS-программирования разработчики могли переопределять undefined и записывать в него какое-нибудь своё значение. А вот void всегда возвращает настоящее значение undefined .

Во-вторых — использование оператора void — это интересный способ работы с немедленно вызываемыми функциями:

void function() < console.log('What') >()

И всё это — без загрязнения глобального пространства имён:

void function aRecursion(i) < if(i >0) < console.log(i--) aRecursion(i) >>(3) console.log(typeof aRecursion) // undefined

Так как оператор void всегда возвращает undefined и всегда вычисляет переданное ему выражение, в нашем распоряжении оказывается весьма выразительный способ возвращения из функции без возврата какого-то значения, но с вызовом, например, некоего коллбэка:

// возврат чего-то кроме undefined приведёт к аварийной остановке приложения function middleware(nextCallback) < if(conditionApplies()) < return void nextCallback(); >>

Это приводит нас к самому важному способу использования void . Данный оператор представляет собой нечто вроде «поста охраны» приложения. Если некая функция всегда должна возвращать undefined — обеспечить это можно, воспользовавшись оператором void .

button.onclick = () => void doSomething();

Тип данных void в TypeScript

Тип void в TypeScript можно назвать чем-то вроде противоположности типа any . Функции в JavaScript всегда что-то возвращают. Это может быть либо некое заданное программистом значение, либо undefined :

function iHaveNoReturnValue(i) < console.log(i) >// возвращает undefined

Так как JavaScript функции, из которых явным образом ничего не возвращается, всегда возвращают undefined , void в TypeScript является подходящим типом, сообщающим разработчикам о том, что функция возвращает undefined :

declare function iHaveNoReturnValue(i: number): void

Сущность void в виде типа можно ещё использовать для параметров и для любых других объявлений переменных. Единственное значение, которое всегда можно передать void-параметру — это undefined .

declare function iTakeNoParameters(x: void): void iTakeNoParameters() // ОК iTakeNoParameters(undefined) // ОК iTakeNoParameters(void 2) // ОК

В результате оказывается, что в TS типы void и undefined — это почти одно и то же. Но между ними есть одно маленькое различие, которое, на самом деле, чрезвычайно важно. Возвращаемый тип void может быть заменён на другие типы, что позволяет реализовывать продвинутые паттерны работы с коллбэками.

function doSomething(callback: () => void) < let c = callback() //здесь callback всегда возвращает undefined //тип c - тоже undefined >// эта функция возвращает число function aNumberCallback(): number < return 2; >// работает; обеспечивается типобезопасность в doSometing doSomething(aNumberCallback)

Разработчики ожидают от подобных конструкций, часто используемых в JS-приложениях, именно такого поведения. Вот материал на эту тему.

Если вы хотите, чтобы функция принимала бы лишь функции, которые возвращают undefined — вы можете соответствующим образом изменить сигнатуру метода:

// было // function doSomething(callback: () => void) < // стало function doSomething(callback: () =>undefined) < /* . */ >function aNumberCallback(): number < return 2; >// Ошибка - типы не совпадают doSomething(aNumberCallback)

Итоги

Оператор void в JavaScript и тип данных void в TypeScript — сущности довольно простые и понятные. Круг ситуаций, в которых они применимы, ограничен. Однако надо отметить, что программист, который их использует, скорее всего, не столкнётся при работе с ними с какими-то проблемами.

Уважаемые читатели! Пользуетесь ли вы void в JS и TS?