TypeScript中的类型断言[as语法|＜＞语法]的使用

Typescript中类型断言官方解释

要理解好类型断言，其实就深刻理解一句话：你会比TypeScript更了解某个值的详细信息 。

类型断言，断言 断言，顾名思义，我断定怎么怎么样，代入这句话里就是，我断定这个类型是什么。当然这是我们主观上的思维逻辑，程序并不认可，所以我们需要告诉程序：“相信我，我知道自己在干什么” 。

这么干说，大家可能还是理解的不够透彻，我用两个函数举一个例子：

/**
 * @param d 日期
 * @param f 想要格式化的字符串
 */
function dateFormatter(d: Date | string, f?: string) {
    const date = new Date(d);
    if (f) {
        return `${date.getFullYear()}${f}${date.getMonth() + 1}${f}${date.getDate()}`
    } else {
        return new Date(d);
    }
}

上面这是一个简单的日期格式化的小函数， f 是连接符，如果 f 有值，那么就用 f 来连接日期并返回，如果没有值，则直接返回一个new Date(d) 。

/**
 * @param d 日期字符串
 */
function dealDate(d: string) {
    return new Date(d).getTime();
}

dealDate()函数接受要给string类型的字符串,返回这个时间的毫秒数。

接下来，我们先调用第一个dateFormatter() 函数，接收返回值，然后传递给dealDate()函数，此时我们一般这么调。

const date = dealDate(dateFormatter('2020-7-28', '/'));

这么调用的问题就在于，我们知道 dateFormatter() 函数因为 f 参数的存在，返回的值肯定是一个string类型。

但是TS不这么认为，在TS的推导中，dateFormatter()函数可能还会返回 Date 类型的值，所以就会给你标红，提示你 dealDate() 函数需要传递字符串类型的值，但是你传递过来的可能是 string 或者 Date，类型不匹配。

但是可以编译通过。

这种时候我们就符合我们前面说的那种情况了，我们可以断定传过去一定是字符串。此时我们可以这么用：

const date = dealDate(dateFormatter('2020-7-28','/') as string);

// 或者这么用
const a = dealDate(<string>dateFormatter('2020-7-28', '/'));

这就是Typescript中的类型断言了。

到此这篇关于TypeScript中的类型断言[as语法|＜＞语法]的使用的文章就介绍到这了,更多相关TypeScript 类型断言内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们！

赞 (0)

相关推荐

  • TypeScript函数和类型断言实例详解

    TypeScript函数和类型断言实例详解

    目录 开始 断言 非空断言 类型断言 尖括号 as 确定赋值断言 类型守卫 trpeof in 函数 可选参数 默认值参数 函数重载 结束 开始 现在要加速学习了,大佬们有没有内推,给个推荐 会vue2/vue3 + ts 断言 非空断言 非空断言就是确定这个变量不是null或者undefined,就是把null或者undefined从他的类型中排除 function demo(message:string|undefined|null) { const str: string = messag

  • TypeScript中的类型断言[as语法|＜＞语法]的使用

    Typescript中类型断言官方解释 要理解好类型断言,其实就深刻理解一句话:你会比TypeScript更了解某个值的详细信息 . 类型断言,断言 断言,顾名思义,我断定怎么怎么样,代入这句话里就是,我断定这个类型是什么.当然这是我们主观上的思维逻辑,程序并不认可,所以我们需要告诉程序:“相信我,我知道自己在干什么” . 这么干说,大家可能还是理解的不够透彻,我用两个函数举一个例子: /** * @param d 日期 * @param f 想要格式化的字符串 */ function date

  • 详解TypeScript中的类型保护

    概述 在 TypeScript 中使用联合类型时,往往会碰到这种尴尬的情况: interface Bird { // 独有方法 fly(); // 共有方法 layEggs(); } interface Fish { // 独有方法 swim(); // 共有方法 layEggs(); } function getSmallPet(): Fish | Bird { // ... } let pet = getSmallPet(); pet.layEggs(); // 正常 pet.swim();

  • 深入了解TypeScript中常用类型的使用

    目录 原始类型:string,number,boolean 数组(Arrays) Any类型 在变量上使用类型注释 函数(Functions) 返回类型注释(Return Type Annotations) 匿名函数(Anonymous Functions) 对象类型(Object Types) 可选属性(Options Properties) 联合类型(Union Types) 定义一个联合类型(Define a Union Type) 使用联合类型(Working with Union Ty

  • TypeScript中条件类型精读与实践记录

    目录 在泛型类型中使用条件类型 工具类型 逃离舱 在箭头函数中使用条件类型 结合类型推导使用条件类型 使用条件类型来判断两个类型完全相等 总结 在大多数程序中,我们必须根据输入做出决策.TypeScript 也不例外,使用条件类型可以描述输入类型与输出类型之间的关系. 用于条件判断时的 extends 当 extends 用于表示条件判断时,可以总结出以下规律 若位于 extends 两侧的类型相同,则 extends 在语义上可理解为 ===,可以参考如下例子: type result1 =

  • 一文带你了解Go语言中的类型断言和类型转换

    一文带你了解Go语言中的类型断言和类型转换

    目录 类型断言 类型判断 为什么需要断言 类型转换 什么时候使用类型转换 类型为什么称为转换 类型结论 在Go中,类型断言和类型转换是一个令人困惑的事情,他们似乎都在做同样的事情. 下面是一个类型断言的例子: var greeting interface{} = "hello world" greetingStr := greeting.(string) 接着看一个类型转换的例子: greeting := []byte("hello world") greeting

  • TypeScript中枚举类型的理解与应用场景

    目录 一.是什么 二.使用 数字枚举 字符串枚举 异构枚举 本质 三.应用场景 总结 一.是什么 枚举是一个被命名的整型常数的集合,用于声明一组命名的常数,当一个变量有几种可能的取值时,可以将它定义为枚举类型 通俗来说,枚举就是一个对象的所有可能取值的集合 在日常生活中也很常见,例如表示星期的SUNDAY.MONDAY.TUESDAY.WEDNESDAY.THURSDAY.FRIDAY.SATURDAY就可以看成是一个枚举 枚举的说明与结构和联合相似,其形式为: enum 枚举名{     标识

  • TypeScript Type Innference(类型判断)

    TypeScript 是微软开发的 JavaScript 的超集,TypeScript兼容JavaScript,可以载入JavaScript代码然后运行.TypeScript与JavaScript相比进步的地方 包括:加入注释,让编译器理解所支持的对象和函数,编译器会移除注释,不会增加开销:增加一个完整的类结构,使之更新是传统的面向对象语言. 为什么会有 TypeScript? JavaScript 只是一个脚本语言,并非设计用于开发大型 Web 应用,JavaScript 没有提供类和模块的概

  • TypeScript中命名空间与模块化详情

    TypeScript中命名空间与模块化详情

    目录 一.模块 二.命名空间 三.区别 一.模块 TypeScript 与ECMAScript 2015 一样,任何包含顶级 import 或者 export 的文件都被当成一个模块 相反地,如果一个文件不带有顶级的import或者export声明,那么它的内容被视为全局可见的 例如我们在在一个 TypeScript 工程下建立一个文件 1.ts,声明一个变量a,如下: const a = 1 然后在另一个文件同样声明一个变量a,这时候会出现错误信息 提示重复声明a变量,但是所处的空间是全局的

  • Typescript中的as、问号与感叹号详解

    1.as关键字表示断言 在Typescript中,表示断言有两种方式.一种是扩号表示法: let someValue: any = "this is a string"; let strLength: number = (someValue).length; 另一种使用as关键字: let someValue: any = "this is a string"; let strLength: number = (someValue as string).length

随机推荐