译JavaScript和TypeScript中的void

原文地址：https://fettblog.eu/void-in-j…

原文标题：void in JavaScript and TypeScript

本文首发于公众号：符合预期的 CoyPan

如果你是从传统的强类型语言转到 JavaScript 来的，那么你可能熟悉 void 的概念：一种类型，它告诉你函数和方法在调用时不返回任何内容。

void 在 JavaScript 中作为运算符存在，在 TypeScript 中作为基本类型存在。在 JS 和 TS 中，void 的用法和大多数人习惯的有所不同。

JavaScript 中的 void

JS 中的 void 是一个运算符，它对紧跟其后的表达式求值。不管是什么表达式，void 总是返回 undefined。

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

为什么我们需要这么写？这是因为在早些时候，人们可以重写 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，并且 void 总是会对表达式求值，所以有一个非常简单的方法，从函数返回而不返回值，但是仍然调用回调函数：

// returning something else than undefined would crash the app
function middleware(nextCallback) {if(conditionApplies()) {return void nextCallback();
   }
}

我认为，void 最重要的用法：因为 void 总是返回 undefined，他是你 app 安全的守护者。

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

TypeScript 中的 void

TypeScript 中的 void 是 undefined 的子类型。JS 中的函数总会有返回，要么是一个具体的值，要么是 undefined.

function iHaveNoReturnValue(i) {console.log(i)
} // returns undefined

在 JS 中，如果没有具体的返回值的函数会返回 undefined，并且 void 总是会返回 undefined，TS 中的 void 是 y 一个合适的类型，告诉开发人员此函数返回 undefined：

declare function iHaveNoReturnValue(i: number): void

void 作为一个类型，也可以用在函数参数和其他的声明上。唯一可以传入的值是 void：

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)

如果你想确保只能传入返回 undefined 的函数，调整你的回调函数类型：

- function doSomething(callback: () => void) {+ function doSomething(callback: () => undefined) {/* ... */}

function aNumberCallback(): number { return 2;}

// ???? types don't match
doSomething(aNumberCallback)

现在，在大多数时候，你都可以很好的处理 void 了