zoukankan      html  css  js  c++  java
  • typescript中类型断言理解

    typescript很强大,但是用不好时也会很头痛,开发遇到类型错误的情况不在少数,或许你需要了解类型断言。使用断言,简单来说就是先做好一个假设,使得编译通过。

    我一开始接触类型断言时是有点不明白的,后来我了解到原因是 “类型断言更像是类型的选择,而不是类型转换”。我发现不少博客文章里把类型断言说成了类型转换,这在最开始给我带来了一些困扰。

    使用类型断言有两种方式:

    <类型>// 或者
    
    值 as 类型

    推荐以 as 方式,因为 jsx 这样的语法中只支持 as 方式。

    我们还得知道什么时候来使用类型断言,但是这个我没办法一一列举出来,主要因为我也没有很多使用typescript的经验。但是可以举一个最直观的例子:

    function func(val: string | number): number {
      if (val.length) {
        return val.length
      } else {
        return val.toString().length
      }
    }

    函数的参数 val 是一个联合类型,在这里的意思是说 val 可以是字符串类型也可以是数值类型。代码中要返回参数的长度,但是 length 可以是字符串的属性,而数值是没有这个属性的,所以当 val 是数值时,就先用 toSting() 来将数字转换为字符串再取长度。这样的逻辑本身没问题,但是在编译阶段一访问 val.length 时就报错了,因为 访问联合类型值的属性时,这个属性必须是所有可能类型的共有属性,而length不是共有属性,val 的类型此时也没确定,所以编译不通过。为了通过编译,此时就可以使用类型断言了,如下:

    function func(val: string | number): number {
      if ((<string>val).length) {
        return (<string>val).length
      } else {
        return val.toString().length
      }
    }
    
    或者
    
    function func(val: string | number): number {
      if ((val as string).length) {
        return (val as string).length
      } else {
        return val.toString().length
      }
    }

    例子中,把 val 断言为了 string类型,此时就可以访问 length 属性了。你可能会疑惑如果 val 断言为了string,那么开始定义的联合类型是不是失去了它的意义?答案是否定的。我在一开始就说了类型断言不是类型转换,而是类型选择,可以理解为在编译阶段强行把 val 当作 string类型来访问了。

    以上就是我对类型断言的一些了解,如有不对,欢迎指出。

  • 相关阅读:
    mui 时间选择器和上传图片
    css实现聊天气泡效果
    css总结 -使用display:inline-block,出现元素高度错位
    js DIV延时几秒后消失或显示代码
    js监听textarea 内容的变化,并计算内容的长度c
    生成git的SSH公钥
    IDEA中把普通的Java项目转换成gradle项目
    Idea中自动生成get,set,toString等方法
    IDEA中阿里P3C插件的安装与使用
    IDEA中SonarLint的安装与使用
  • 原文地址:https://www.cnblogs.com/wjaaron/p/11697275.html
Copyright © 2011-2022 走看看