zoukankan      html  css  js  c++  java
  • TypeScript的高级用法(持续更新)

    为什么要使用TypeScript?

    某乎已经解释的很清楚了传送门

    我目前亲身的感受,TpeScript带来的好处

    • 类型系统可以避免很多js的灵活性带来的隐藏bug,譬如在js里变量是可以到处定义,到处赋值,这就会导致中途你都不知道改成什么类型了,会不会有bug
    • 团队协作代码风格更加严格,这一般是强类型编程语言所带来的特性之一,譬如很典型的Java,C#等

    TpeScript香是香,只是使用中会带来以下问题。

    • 入手门槛高,招人的门槛也高了不少
    • 不习惯这么严格的语法,导致最后写成AnyScript,四不像

    TypeScript的高级用法

    支持”函数定义“

    type Foo<T> = T
    let nums: Foo<number> = 1
    

    上面可以理解为

    function Foo (T: any) {
      return T
    }
    

    如果我们对T的类型做限制

    type foo<T extends string> = T;
    

    则可以理解为

    function Foo (T: string) {
      return T
    }
    

    当然了,我们也可以给T一个默认值

    type Foo<T extends string = 'Hello World'> = T;
    

    可以理解为:

    function Foo (T: string = 'Hello World') {
      return T
    }
    

    支持条件判断

    T extends Z ? X : Y
    

    e.g.

    type IsNumber<T> = T extends number ? 'this is a number' : 'this is not a number';
    

    动态推导出联合类型

    interface Student {
      name: string;
      age: number;
    }
    
    type studentKey = keyof Student; // "name" | "age"
    

    遍历联合类型

    通过 in 关键字

    type key = 'vue' | 'react';
    
    type MappedType = { [k in key]: string } // { vue: string; react: string; }
    

    通过 索引

    type frameworks = ['vue', 'react', 'angular'];
    type f0 = frameworks[0]
    type f1 = frameworks[1]
    type f2 = frameworks[2]
    type fa = frameworks[any]
    

    支持 "作用域"

    全局作用域

    declare module '*.png';
    declare module '*.svg';
    declare module '*.jpg';
    

    模块作用域

    就像 nodejs 中的模块一样,每个文件都是一个模块,每个模块都是独立的模块作用域。这里模块作用域触发的条件之一就是使用 export 关键字导出内容。

    每一个模块中定义的内容是无法直接在其他模块中直接获取到的,如果有需要的话,可以使用 import 关键字按需导入。

    参考:

  • 相关阅读:
    HDU 6194【后缀数组】
    SGU 104 Little shop of flowers【DP】
    POJ 2104 K-th Number【整体二分 + 树状数组】
    HDU 5573 Binary Tree【构造】
    UVA 10245 The Closest Pair Problem【分治】
    POJ 1741 Tree【树分治】
    边缘检测的微分算子简单比较【1】
    HDU 5584 LCM Walk【搜索】
    51nod 1686 第K大区间【离散化+二分】
    HDU 5572 An Easy Physics Problem【计算几何】
  • 原文地址:https://www.cnblogs.com/Jomsou/p/13709235.html
Copyright © 2011-2022 走看看