Loading [MathJax]/jax/output/CommonHTML/config.js
首页
学习
活动
专区
圈层
工具
发布
社区首页 >专栏 >typescript-exercises(三)

typescript-exercises(三)

作者头像
阿超
发布于 2024-10-30 04:10:44
发布于 2024-10-30 04:10:44
1360
举报
文章被收录于专栏:快乐阿超快乐阿超

青年人的教育是国家的基石。——富兰克林

题面:

代码语言:javascript
AI代码解释
复制
/*

Intro:

    Since we already have some of the additional
    information about our users, it's a good idea
    to output it in a nice way.

Exercise:

    Fix type errors in logPerson function.

    logPerson function should accept both User and Admin
    and should output relevant information according to
    the input: occupation for User and role for Admin.

*/

interface User {
    name: string;
    age: number;
    occupation: string;
}

interface Admin {
    name: string;
    age: number;
    role: string;
}

export type Person = User | Admin;

export const persons: Person[] = [
    {
        name: 'Max Mustermann',
        age: 25,
        occupation: 'Chimney sweep'
    },
    {
        name: 'Jane Doe',
        age: 32,
        role: 'Administrator'
    },
    {
        name: 'Kate Müller',
        age: 23,
        occupation: 'Astronaut'
    },
    {
        name: 'Bruce Willis',
        age: 64,
        role: 'World saver'
    }
];

export function logPerson(person: Person) {
    let additionalInformation: string;
    if (person.role) {
        additionalInformation = person.role;
    } else {
        additionalInformation = person.occupation;
    }
    console.log(` - ${person.name}, ${person.age}, ${additionalInformation}`);
}

persons.forEach(logPerson);

// In case you are stuck:
// https://www.typescriptlang.org/docs/handbook/2/narrowing.html#the-in-operator-narrowing

输出Error

代码语言:javascript
AI代码解释
复制
index.ts(58,16): error TS2339: Property 'role' does not exist on type 'Person'.
  Property 'role' does not exist on type 'User'.
index.ts(59,40): error TS2339: Property 'role' does not exist on type 'Person'.
  Property 'role' does not exist on type 'User'.
index.ts(61,40): error TS2339: Property 'occupation' does not exist on type 'Person'.
  Property 'occupation' does not exist on type 'Admin'.

答案:

代码语言:javascript
AI代码解释
复制
/*

Intro:

    Since we already have some of the additional
    information about our users, it's a good idea
    to output it in a nice way.

Exercise:

    Fix type errors in logPerson function.

    logPerson function should accept both User and Admin
    and should output relevant information according to
    the input: occupation for User and role for Admin.

*/

interface User {
    name: string;
    age: number;
    occupation: string;
}

interface Admin {
    name: string;
    age: number;
    role: string;
}

export type Person = User | Admin;

export const persons: Person[] = [
    {
        name: 'Max Mustermann',
        age: 25,
        occupation: 'Chimney sweep'
    },
    {
        name: 'Jane Doe',
        age: 32,
        role: 'Administrator'
    },
    {
        name: 'Kate Müller',
        age: 23,
        occupation: 'Astronaut'
    },
    {
        name: 'Bruce Willis',
        age: 64,
        role: 'World saver'
    }
];

export function logPerson(person: Person) {
    let additionalInformation: string;
    if ("role" in person) {
        additionalInformation = person.role;
    } else {
        additionalInformation = person.occupation;
    }
    console.log(` - ${person.name}, ${person.age}, ${additionalInformation}`);
}

persons.forEach(logPerson);

// In case you are stuck:
// https://www.typescriptlang.org/docs/handbook/2/narrowing.html#the-in-operator-narrowing

解析:

这里主要是用到了 in 的语法,注意细节如果是

代码语言:javascript
AI代码解释
复制
if ("role" in person && person.role) {  }

会导致

代码语言:javascript
AI代码解释
复制
index.ts(61,40): error TS2339: Property 'occupation' does not exist on type 'Person'.
  Property 'occupation' does not exist on type 'Admin'.

所以只能使用

代码语言:javascript
AI代码解释
复制
if ("role" in person) {  }
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2024-10-29,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
typescript-exercises(五)
此处主要考察Partial<Type>的使用以及Omit<Type, Keys>的使用
阿超
2024/11/01
1170
typescript-exercises(二)
阿超
2024/10/29
1260
typescript-exercises(四)
阿超
2024/10/31
1680
typescript-exercises(六)
阿超
2024/11/02
1400
typescript-exercises(八)
阿超
2024/11/04
1160
TypeScript 期中考试现在开始!
相信这段时间来,对 TypeScript 感兴趣的小伙伴们已经把这个神器给系统的学习了一遍了吧。如果计划开始学习但是还没有开始,或者没有找到资料的同学,可以看下我在之前文章中 前端进阶指南 找一下 TypeScript 部分的教程,自行学习。
ssh_晨曦时梦见兮
2020/06/09
7460
TypeScript 期中考试现在开始!
TypeScript复合类型与高级语法详解
在前一篇文章中,我们学习了TypeScript的基础语法和类型系统。今天,我们将继续深入学习TypeScript的复合类型和高级语法特性。复合类型是由多个基本类型组合而成的类型,包括数组、对象、联合类型、交叉类型等。高级语法特性则包括类型断言、类型守卫、泛型等,这些特性使TypeScript的类型系统更加灵活和强大。
安全风信子
2025/11/13
1090
typescript-exercises(十)
https://www.typescriptlang.org/docs/handbook/2/mapped-types.html
阿超
2024/11/06
1240
强烈推荐:2020年15道优秀的TypeScript练习题 (上集)
TypeScript是目前不得不学的内容 Ts的东西其实非常非常的多,上到tsconfig的配置,下到写法,内容。 Ts正在疯狂的迭代,进入4.0版本即将,里面的内容非常非常的多,可以说,入门很简单,但是要写精通,真的还是要花很多功夫。 本文一共分上、下集,欢迎你关注我的公众号:【前端巅峰】,前端、后端、源码、架构、算法、面试都有,更有理财,心理学、开源项目等日常分享。 正式开始 第一题,基本interface使用考察,定义一个item接口,符合使用 interface item { name: str
Peter谭金杰
2020/07/21
1.2K0
TypeScript 练习题
TypeScript 的学习资料非常多,其中也不乏很多优秀的文章和教程。但是目前为止没有一个我特别满意的。原因有:
lucifer210
2020/09/30
1.4K0
TypeScript 练习题
typescript-exercises
https://github.com/typescript-exercises/typescript-exercises
阿超
2024/10/08
1350
typescript-exercises(七)
阿超
2024/11/03
1390
typescript-exercises(十三)
阿超
2024/11/09
1190
Typescript中的extends关键字
extends关键字在TS编程中出现的频率挺高的,而且不同场景下代表的含义不一样,特此总结一下:
桃翁
2021/09/30
5.7K1
typescript 高级技巧
用了一段时间的 typescript 之后,深感中大型项目中 typescript 的必要性,它能够提前在编译期避免许多 bug,如很恶心的拼写问题。
夜尽天明
2019/10/21
1.3K0
分享 40 道关于 Typescript 的面试题及其答案
在进行前端技术面试的时候,我们经常会遇到TypeScript 的一些面试题,因此,今天这篇文章,我整理汇总了40道关于TypeScript 的基础知识的面试题。
前端达人
2023/11/13
2K0
分享 40 道关于 Typescript 的面试题及其答案
Node.js 项目 TypeScript 改造指南(二)
最近笔者把一个中等规模的 Koa2 项目迁移到 TypeScript,和大家分享一下 TypeScript 实践中的经验和技巧。
WecTeam
2019/12/26
3.8K0
TypeScript进阶
类型断言(Type Assertion)是开发者手动指定一个值的类型: <类型>值或值 as 类型
刘亦枫
2020/03/19
1.2K0
TypeScript学习笔记(二)—— TypeScript基础
JavaScript 的类型分为两种:原始数据类型(Primitive data types)和对象类型(Object types)。
张果
2022/10/04
5.8K0
TypeScript学习笔记(二)—— TypeScript基础
【TypeScript】004-类型推论 与 联合类型
TypeScript 会在没有明确的指定类型的时候推测出一个类型,这就是类型推论。
訾博ZiBo
2025/01/06
3450
相关推荐
typescript-exercises(五)
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
首页
学习
活动
专区
圈层
工具
MCP广场
首页
学习
活动
专区
圈层
工具
MCP广场