TypeScript 是一种由微软开发的开源编程语言，它为 JavaScript 添加了静态类型、类、接口和其他高级概念。尽管 TypeScript 与 JavaScript 有很大的相似性，但它们之间也有一些重要的区别。其中，TypeScript 中的 void 类型和 Null/Undefined 类型在开发中经常被使用到，本文将详细介绍它们的使用方法和注意事项。
void 类型
void 类型表示函数没有返回值，或者可以返回 undefined （在严格模式下返回 undefined 或者 null 会导致编译错误）。在函数的定义中，我们可以将返回值类型声明为 void 类型。
function doSomething(): void {
console.log("Hello world!");
}在 TypeScript 中，如果你尝试使用一个返回值类型为 void 的函数的返回值，你会获得一个编译错误。
const result = doSomething(); // Error: Type 'void' is not assignable to type 'const result: any'
实际上，void 类型在 TypeScript 中用途非常的广泛。在 React 开发中，我们通常将事件处理函数的返回值类型声明为 void 类型，因为返回值不会被使用到。
function handleClick(): void {
console.log("Button clicked!");
}
<button onClick={handleClick}>Click me</button>Null 和 Undefined 类型
在 JavaScript 中，null 和 undefined 都可以表示一个变量或属性的“空值”。在 TypeScript 中，它们都有各自的类型。在代码中，我们可以使用它们来表示变量或属性的值可能为 null 或 undefined。
let myVar: null; let myVar2: undefined; let myVar3: null | string; let myVar4: undefined | number;
上述代码中，myVar 和 myVar2 是 null 和 undefined 类型。myVar3 和 myVar4 是联合类型，表示它们可能是 null 或它们后面声明的类型。
在 TypeScript 中，如果你声明一个变量的类型是 null 或者 undefined，它不会自动转换为（不是 any 类型的）其他类型。例如，你不能将一个 undefined 类型的变量赋值给一个 number 类型的变量。
let myVar: undefined; let myNumber: number = myVar; // Error: Type 'undefined' is not assignable to type 'number'.
如果你想将 null 或 undefined 赋给其他类型的变量，你可以使用类型断言。
let myVar: undefined; let myNumber: number = myVar as number;
深入探讨 void 和 null/undefined 类型
在 TypeScript 中，void 类型和 null/undefined 类型看起来很相似，但它们之间有一个重要的区别。如果你在一个函数的声明中将返回值类型声明为 null 或 undefined 类型，那么这个函数只能返回 null 或 undefined 值。例如：
function returnNull(): null {
return null;
}
function returnUndefined(): undefined {
return undefined;
}与此不同的是，如果你将返回值类型声明为 void 类型，那么函数可以不返回值或返回 undefined 值。例如：
function returnVoid(): void {
console.log("Hello world!");
}
function doSomething(): void {
// do something
}在 React 开发中，我们通常会在一个函数组件中返回 JSX。在 TypeScript 中，你可以将返回值类型声明为 React.ReactElement 或 null 类型，表示这个函数要么返回 JSX 元素，要么返回 null 值。如果你将返回值类型声明为 void 类型，这样做是不好的。
function MyComponent(): React.ReactElement | null {
return <div>Hello world!</div>;
}当然，理论上你也可以将返回值类型声明为 void 类型，但这样会让代码变得不够明确，会给开发带来困扰。
总结
在 TypeScript 中，void 类型和 null/undefined 类型都是非常常用的类型。我们可以将函数的返回值类型声明为 void 类型表示这个函数没有返回值，将变量的类型声明为 null 或 undefined 类型表示这个变量的值可能为空。但是，在使用中我们需要注意到二者的区别。具体来说，void 类型表示函数可以返回 undefined 值，而 null/undefined 类型表示函数只能返回 null 或 undefined 值。对于每个类型，我们需要仔细思考什么时候使用它，什么时候避免使用它，这样才能编写出高质量的 TypeScript 代码。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/654b6e037d4982a6eb544e4c