Logo
Section 1 / 6

基本类型与类型推断

了解 TypeScript 如何理解原始值,并自动推断类型,从而在无需额外语法的情况下让代码更加安全。

导入

基本类型与类型推断

了解 TypeScript 如何理解原始值,并自动推断类型,从而在无需额外语法的情况下让代码更加安全。

...
TypeScript 中的类型推断
1let user = "Ada"; 2let age = 32; 3let isActive = true; 4 5console.log(`用户: ${user}, 年龄: ${age}, 是否激活: ${isActive}`);
1let version = 6; 2version = "six"; 3 4console.log(`版本现在是: ${version}`);

let 推断为通用字符串类型;const 推断为具体值 "dark" —— 一个字符串字面量

1let mode = "dark"; 2const theme = "dark";
1let data; 2data = "hello"; 3data = 42; 4 5console.log(`数据是: ${data}`); 6 7let result = null; 8result = "done"; 9result = true; 10 11console.log(`结果是: ${result}`);
...
TypeScript 如何推断类型
1// ▶ 修复下面的声明 ◀ 2let url = null; // 应该变为字符串 3let isOnline; // 应该变为布尔值 4const theme = "light"; // 保持不变 5 6// ─────────── 请勿编辑以下内容 ─────────── 7url = "https://example.com"; 8isOnline = false; 9 10console.log(`主题: ${theme}, URL: ${url}, 在线状态: ${isOnline}`);

显示解决方案

通过使用有意义的初始值进行初始化,我们可以引导 TypeScript 正确推断类型,而无需显式添加类型注解

1let url = ""; 2let isOnline = false; 3const theme = "light"; 4 5// ─────────── 请勿编辑以下内容 ─────────── 6url = "https://example.com"; 7isOnline = false; 8 9console.log(`主题: ${theme}, URL: ${url}, 在线状态: ${isOnline}`);

解释:

  • url:使用空字符串初始化可将类型限定为 string,后续赋值必须仍为字符串。

  • isOnline:使用 false 初始化,TypeScript 即可推断其类型为 boolean,之后的赋值也需保持布尔类型。

  • theme:该变量已具有精确类型("light" 字符串字面量)。

显示提示

提示:

  • null 和 undefined 对类型推断无帮助——TypeScript 会将其拓宽为 any 类型。

  • 为每个变量提供有意义的初始值;如果变量值不会改变,优先使用 const。

  • 空字符串 "" 仍然是有效的字符串值。

TypeScript 简介

类型注解