TypeScript系列教程九《类型转换》-- 模板文本类型

本文介绍了TypeScript中模板文本类型的推断和内在字符串操作类型。通过`makeWatchedObject`函数展示了如何利用泛型和Key进行属性类型的推断,确保回调函数接收到正确类型的参数。同时,文章探讨了内置的字符串操作类型,如Uppercase、Lowercase和Capitalize,用于首字母大写和小写转换,并提供了实用示例。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

/// so that you can watch for changes to properties.

declare function makeWatchedObject(obj: Type): Type & PropEventSource;

通过这种方式,我们可以构建在给定错误属性时出错的内容:

在这里插入图片描述

[](()模板文本类型推断

上面callback 的类型是any ,没有按照属性推断类型,我们可以利用泛型和Key进行推断。

type PropEventSource = {

on<Key extends string & keyof Type>

(eventName: ${Key}Changed, callback: (newValue: Type[Key]) => void ): void;

};

declare function makeWatchedObject(obj: T 《大厂前端面试题解析+Web核心总结学习笔记+企业项目实战源码+最新高清讲解视频》无偿开源 徽信搜索公众号【编程进阶路】 ype): Type & PropEventSource;

const person = makeWatchedObject({

firstName: “Saoirse”,

lastName: “Ronan”,

age: 26

});

person.on(“firstNameChanged”, newName => {

(parameter) newName: string

console.log(new name is ${newName.toUpperCase()});

});

person.on(“ageChanged”, newAge => {

(parameter) newAge: number

if (newAge < 0) {

console.warn(“warning! negative age”);

}

})

这样我们就可以调用属性名+Changed方法,然后找到属性推断出类型。

[](()内在字符串操作类型

为了帮助进行字符串操作,TypeScript包括一组可用于字符串操作的类型。为了提高性能,这些类型是编译器内置的,在TypeScript附带的.d.ts文件中找不到。

Uppercase<StringType>

大写操作,每个字符大写

例子:

type Greeting = “Hello, world”

type ShoutyGreeting = Uppercase

//type ShoutyGreeting = “HELLO, WORLD”

type ASCIICacheKey = ID-${Uppercase<Str>}

type MainID = ASCIICacheKey<“my_app”>

//type MainID = “ID-MY_APP”

Lowercase<StringType>

每个字符转小写操作

例子:

type Greeting = “Hello, world”

type QuietGreeting = Lowercase

//type QuietGreeting = “hello, world”

type ASCIICacheKey = id-${Lowercase<Str>}

type MainID = ASCIICacheKey<“MY_APP”>

//type MainID = “id-my_app”

Capitalize<StringType>

作用:首字母大写

例子:

type LowercaseGreeting = “hello, world”;

type Greeting = Capitalize;

//type Greeting = “Hello, world”

Uncapitalize<StringType>

作用:首字母小写

type UppercaseGreeting = “HELLO WORLD”;

type UncomfortableGreeting = Uncapitalize;

//type UncomfortableGreeting = “hELLO WORLD”

类型字符串操作技术实现参考

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值