类型断言

本课属于 Coddy JavaScript 学习旅程的“TypeScript 入门”单元。第 68 课，共 73 课。

有时，TypeScript 没有足够的信息来确定某个值的确切类型，但作为开发者，你更清楚这个值的实际类型。类型断言可以让你告诉 TypeScript：“相信我，我知道这个值属于这种特定类型。”

TypeScript 提供了两种类型断言语法。as 语法是更常用的方式：

let data: unknown = '{"name": "John", "age": 30}';
let user = data as string;

你也可以使用尖括号语法，不过在现代 TypeScript 中不太常见：

let data: unknown = '{"name": "John", "age": 30}';
let user = <string>data;

挑战

简单

创建一个函数，用于处理来自外部 API 模拟的数据。你将使用 unknown 类型的值，并通过类型断言安全地访问其属性。

创建一个类型为 unknown 的变量 apiResponse，并将以下 JSON 字符串赋给它：

{"userId": 42, "username": "alice_dev", "isActive": true}

创建一个名为 processUserData 的函数，该函数：

接收一个类型为 unknown 的参数 data
使用类型断言，将 data 视为 string
使用 JSON.parse() 解析 JSON 字符串
使用另一个类型断言，将解析结果视为一个具有以下属性的对象：userId（number）、username（string）和 isActive（boolean）
返回格式化后的字符串："User [userId]: [username] (Active: [isActive])"
显式声明返回类型为 string

创建其他测试数据：

创建类型为 unknown 的 secondApiResponse，其 JSON 字符串为：{"userId": 15, "username": "bob_admin", "isActive": false}
创建类型为 unknown 的 thirdApiResponse，其 JSON 字符串为：{"userId": 99, "username": "charlie_user", "isActive": true}

测试你的函数，并打印以下输出：

使用 apiResponse 调用 processUserData，并打印结果
使用 secondApiResponse 调用 processUserData，并打印结果
使用 thirdApiResponse 调用 processUserData，并打印结果

亲手试试

// 创建 API 响应变量
const apiResponse: unknown = '{"userId": 42, "username": "alice_dev", "isActive": true}';
const secondApiResponse: unknown = '{"userId": 15, "username": "bob_admin", "isActive": false}';
const thirdApiResponse: unknown = '{"userId": 99, "username": "charlie_user", "isActive": true}';

// TODO: 在这里创建 processUserData 函数

// 测试函数并打印结果
console.log(processUserData(apiResponse));
console.log(processUserData(secondApiResponse));
console.log(processUserData(thirdApiResponse));

自我测试

这节课包含一个小测验。开始学习即可作答，并记录你的进度。

TypeScript 入门中的所有课

自己练习： TypeScript 在线编辑器