本文详细解析 JavaScript 和 TypeScript 中 void 的不同用法。在 JS 中，void 是返回 undefined 的运算符，用于防止覆盖 undefined 及调用立即执行函数；在 TS 中，void 是 undefined 的子类型，用于声明无返回值函数。文章探讨了 void 在回调模式中的可替换性及其作为类型安全门的作用，帮助开发者正确使用这一特性。
JavaScript 和 TypeScript 中 void 的具体使用
如果你来自传统的强类型语言背景，可能对 void 概念并不陌生：它是一种类型，用于表明函数或方法在调用后不返回任何内容。
在 JavaScript 中，void 表现为一个运算符；而在 TypeScript 中，它则是一种基本类型。在这两种语言环境中，void 的工作机制与大多数开发者的常规认知存在差异。
JavaScript 中的 void
JavaScript 中的 void
在 JavaScript 里，void 是一个运算符，用于计算其右侧的表达式。无论该表达式的结果如何，void 运算符始终返回 undefined。
let i = void 2; // i === undefined我们为何需要这种机制？首先，在早期 JavaScript 中，开发者可以覆盖 undefined 变量并赋予其实际值，而 void 运算符始终返回真实的 undefined，从而保证安全性。
其次，这是一种调用立即执行函数（IIFE）的有效方式：
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，且它总是计算旁边的表达式，因此你可以利用它以一种简洁的方式从函数返回，确保不返回值，同时仍能调用回调函数，例如：
// returning something else than undefined would crash the app
function middleware(nextCallback) {
if(conditionApplies()) {
return void nextCallback();
}
}
这引出了 void 最重要的用途：它是程序的安全门。当你的函数应当始终返回 undefined 时，使用 void 可以确保这一点。
button.onclick = () => void doSomething();
TypeScript 中的 void
TypeScript 中的 void
在 TypeScript 中，void 是 undefined 的子类型。JavaScript 中的函数总是会返回某些内容，要么是一个具体的值，要么是 undefined：
function iHaveNoReturnValue(i) {
console.log(i)
} // returns undefined
因为没有返回值的函数总是返回 undefined，而 void 在 JavaScript 中也始终返回 undefined，所以 TypeScript 中的 void 是一个正确的类型，用于告知开发人员该函数返回 undefined：
declare function iHaveNoReturnValue(i: number): voidvoid 作为类型也可用于参数及其他所有声明。唯一可以传递的值是 undefined：
declare function iTakeNoParameters(x: void): void
iTakeNoParameters() // 👍
iTakeNoParameters(undefined) // 👍
iTakeNoParameters(void 2) // 👍
因此，void 和 undefined 几乎相同。尽管存在细微差别，但这种差异至关重要：作为返回类型的 void 可以被不同类型的值替换，从而支持高级回调模式：
function doSomething(callback: () => void) {
let c = callback() // at this position, callback always returns undefined
//c is also of type undefiend
}
// this function returns a number
function aNumberCallback(): number {
return 2;
}
// works 👍 type safety is ensured in doSometing
doSomething(aNumberCallback)
这是预期的行为，常用于 JavaScript 程序中。你可以在我的其他文章中阅读更多关于这种被称为“可替换性”（substitutability）的模式。
如果你想确保传递的函数仅返回 undefined（即“无操作”），请确保调整你的回调方法签名：
- function doSomething(callback: () => void) {
+ function doSomething(callback: () => undefined) { /* ... */ }
function aNumberCallback(): number { return 2; }
// 💥 types don't match
doSomething(aNumberCallback)
在大多数情况下，你都能与 void 良好协作。
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持本站。