文章目录

  • ts是什么
  • ts增加了什么
  • TypeScript中的基本类型
  • 字面量
  • number
  • boolean
  • string
  • any
  • unknown
  • 类型断言
  • void
  • never
  • object
  • function
  • array
  • tuple
  • enum
  • & 表示同时
  • 类型的别名


ts是什么

  • 以javascript为基础，来构建的语言
  • 它是一个javascript的超集，它对js进行了扩展，并添加了 类型
  • 兼容所有js平台
  • 不能被js解析器直接执行（即.ts文件不可以被执行），需要将ts代码编译成js

ts增加了什么

  • 类型
  • 支持es的新特性，支持js所有内容
  • 添加了es不具有的新特性：抽象类、接口
  • 丰富的配置选项（可严格、可松散、可以把ts编译成es3等版本，兼容型好，）
  • 强大的开发工具
  • 有提示

TypeScript中的基本类型

  • 类型声明
  • 通过类型声明可以指定TS中变量（参数、形参）的类型；
  • 指定类型后，当为变量赋值时，TS编译器会自动检查值是否符合类型声明，符合则赋值，否则报错；
  • 简而言之，类型声明给变量设置了类型，使得变量只能存储某种类型的值；
  • 自动类型判断
  • TS拥有自动的类型判断机制
  • 当对变量的声明和赋值是同时进行的，TS编译器会自动判断变量的类型
  • 所以如果你的变量的声明和赋值时同时进行的，可以省略掉类型声明
    let a = 30 ,此时a默认为number类型
  • 类型：

类型

例子

描述

number

1, -33, 2.5

任意数字

string

‘hi’, “hi”, hi

任意字符串

boolean

true、false

布尔值true或false

字面量

其本身

限制变量的值就是该字面量的值

any

*

任意类型

unknown

*

类型安全的any

void

空值（undefined）

没有值（或undefined）

never

没有值

不能是任何值

object

{name:‘孙悟空’}

任意的JS对象

array

[1,2,3]

任意JS数组

tuple

[4,5]

元素，TS新增类型，固定长度数组

enum

enum{A, B}

枚举，TS中新增类型

字面量

//不可改变，有点像常量
let a: 10
a = 11 
// 不可设置为出字面量以外的值
let b: 'male' | 'false'
b = 'male'
b = 'false'
b = 'hello' 
// 既限定类型又给出初始值
let color: string = 'red'
color = 'blue'

number

let a: number;
let decLiteral: number = 6;
let hexLiteral: number = 0xf00d;
let notANumber: number = NaN;
let infinityNumber: number = Infinity;

boolean

let a: boolean;
let b = true;

string

let a: string;
let color: string = 'red'
color = 'blue'

any

表示任意类型，一个变量设置为any，相当于关闭了该变量的类型检测

any可以赋值给任意类型的变量

let d: any;
d = 'hello';
d = true;
// any可以赋值给任意类型的变量
let s: string;
s = d

unknown

实际上是一个安全类型的any
unknown 类型的变量不能赋值给任意类型的变量

let e: unknown
e = 10
e = 'hello'
e = true
let s: string;
s = e //报错

类型断言

手动指定一个值的类型

  • 语法：
  • 变量 as 类型
  • <类型>变量
s = e as string
s = <string>e

void

用来表示空，以函数为例，就表示没有返回值或undefined

function fn(): number | string | void {
  return undefined
}

never

表示没有返回值

function fn2(): never {
  throw new Error('报错了')
}

object

{} 用来指定对象中可以包含哪些属性

  • 语法
  • {属性名:属性值} 表示必须要有的属性
  • 属性名?:属性值 表示可选属性
  • [propName: string]: any 表示属性名为字符串类型，属性值为任意类型
let b: { name: string, age?: number }
b = { name: '孙悟空', age: 18 }
b = { name: '孙悟空' }
let c: { name: string, [propName: string]: any }
c = { name: '猪八戒', a: 1, b: 2 }

function

设置函数结构的类型声明

  • 语法：
  • (形参：类型，形成:类型)=> 返回值类型
let d: (a: number, b: number) => number
d = function (n1, n2): number {
  return n1 + n2
}

array

  • 语法：
  • 类型[]
  • Array<类型>
let e: string[]
e = ['a', 'r', 'fdsf']

let g: Array<number>
g = [23, 43, 123]

tuple

元组就是固定长度的数组
由于长度固定，变化数量少，存储效率比数组高

  • 语法
  • [类型，类型，类型]
let h: [string, number]
h = ['h', 123]

enum

enum Gender {
  Male,
  Female
}
let i: { name: string, gender: Gender }
i = {
  name: '孙悟空',
  gender: Gender.Male // 'male'
}
console.log(i.gender === Gender.Female)

& 表示同时

  • 语法：
    let j: { name: string } & { age: number }
    j = { name: ‘孙悟空’, age: 18 }

类型的别名

  • 语法：
    type myType = 1 | 2 | 3 | 4
let k: myType
let l: myType