自学React系列-08之TypeScript

发表于 分类于

数据类型

  • number
  • string
  • boolean
  • null
  • undefined
  • symbol
  • object：对象类型
  • any：可以表示任何类型，与 Java 中的 Object 类型一个含义

定义变量

  • 定义 string，单引号 '' 或者双引号 "" 
    1
    let a: string = 'a'; // 定义 string 类型的变量 a

let 和 const 都可以定义变量，区别在于 let 和 const 定义的变量作用域不同。 const 是全局，let 是局部。

  • 定义模板字符串

    1
    let a: string = `good ${name}`;

  • 定义 number

    1
    let num: number = 1.1;

  • 定义数组

    1
    let arr:number[] = [1,2,3,4];

类型断言

向 let num: number = 1.1; 中的 : number 不是必须的， ts 会根据赋值的类型自动推断出变量的类型，也可以用下面的写法:

1
let num = 1.1;

定义数组

使用中括号定义数组 []

1
let arr: number[] = [1, 2, 3, 4, 5];

泛型数组

1
let arr: Array<number> = [1, 2, 3, 4, 5];

定义函数

普通参数

参数数量确定，参数类型确定，返回值确定。

1
2
3
function foo(a: string): string {
  return a;
}

可选参数

函数有多个参数，但是其中的某一个或某几个参数可以不传值

1
2
3
function foo(a: string, b?: string): string {
  return a;
}

上面的 b 可以不不传值

参数默认值

函数参数为其设置默认值

1
2
3
function foo(a: string, b: string = 'b'): string {
  retunr a + b;
}

上面的示例中，如果调用 foo 函数，且不对参数 b 传值的话，b 的默认值就是字符串b。

参数多类型

函数参数类型不固定，但是只能是其中的一种或几种类型，比如参数 b 只能是 number 或者 string 两种类型中的一种，但具体是哪一种不确定。

1
2
3
function foo(a: string|number): string|number {
  return a;
}

Interface(接口)

接口可以定义对象的描述

接口可以定义一些抽象方法

类

类实现接口