zoukankan      html  css  js  c++  java
  • TS数据类型:类型别名/联合类型/字面量类型/类型推论等纲要

    在学C/C++  Java等强类型语言时,变量类型是唯一的,需要先指定。PHP JavaScript等弱类型语言时,无需指定变量类型

    但是,TypeScript里面的联合类型 (Union Type) 和字面量类型 (Literal Type),为了真香定律,还是琢磨下

    类型别名

    类型别名用来给一个类型起个新名字,使用 type 创建类型别名,类型别名常用于联合类型。

    type nameStr = string;
    type nameArr = string[];
    type nameType = nameStr | nameArr;

    在实际应用中,有些类型名字比较长或者难以记忆,重新命名是一个较好的解决方案。

    联合类型-Union Type

    联合类型表示的值可能是多种不同类型当中的某一个。比如,A | B 联合类型的某个值就可能是 A 类型,也可能是 B 类型。很显然,联合类型放宽了类型的取值的范围,也就是说值的范围不再限于某个单一的数据类型。同时,它也不是无限制地放宽取值的范围,如果那样的话,完全可以使用 any 代替。

    type SeriesOfTypes = string | number | boolean | Error;

    提示:我们在创建联合类型的时候,可以使用 type 关键字为自定义的联合类型加上别名,这样可以避免我们重复它们的定义

    字面量类型-Literal Type

    字面量也就是 JavaScript 基元类型具体的值。而在 TypeScript 中,我们可以将字面量作为一种自定义的类型,这种类型被称为字面量类型。比如:

    type China = 'China';
    let country: China = 'China';  // ok
    country = 'America';  // error: Type '"America"' is not assignable to type '"China"'

    结合上面所了解到的联合类型,我们可以将自定义的字面量类型组合成一个新的联合类型:

    type Weekdays = 1 | 2 | 3 | 4 | 5;
    
    let day: Weekdays = 1;  // ok
    day = 5;  // ok
    day = 6;  // error: Type '6' is not assignable to type 'Weekdays'.

    字面量联合类型的形式与枚举类型有些类似,所以,如果您仅是使用数字,可以考虑是否使用给具有表达性的枚举类型。

    类型推论

    上面说到没有指定类型的变量默认为any类型的,但是当声明变量时定义了该变量值,则默认变量为该值得类型值,这就是类型推论

    let anyThing = 'string'
    anyThing=10 // error  Type '10' is not assignable to type 'string'.

    若声明时未定义,则不会

    let anyThing
    anyThing='string'
    anyThing=10 // ok

    类型推论常会成为新手的绊脚石

    类型断言

    可以用来绕过编译器的类型推断,手动指定一个值的类型。

    有时还我们还不知道一个值的类型,导致在开发过程中总是报一些令人头痛的类型错误。使用断言,简单来说就是先做好一个假设,使得编译通过。

    语法有下面两种

    1. <类型>值  

    2.  值 as 类型

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

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

    类型断言更像是类型的选择,而不是类型转换

    转载本站文章《TS数据类型:类型别名/联合类型/字面量类型/类型推论等纲要》,
    请注明出处:https://www.zhoulujun.cn/html/webfront/ECMAScript/typescript/2018_0411_8369.html

  • 相关阅读:
    我的浏览器收藏夹分类
    我的浏览器收藏夹分类
    Java实现 LeetCode 318 最大单词长度乘积
    Java实现 LeetCode 318 最大单词长度乘积
    Java实现 LeetCode 318 最大单词长度乘积
    Java实现 LeetCode 316 去除重复字母
    Java实现 LeetCode 316 去除重复字母
    Java实现 LeetCode 316 去除重复字母
    Java实现 LeetCode 315 计算右侧小于当前元素的个数
    Java实现 LeetCode 315 计算右侧小于当前元素的个数
  • 原文地址:https://www.cnblogs.com/zhoulujun/p/13693574.html
Copyright © 2011-2022 走看看