TypeScript数据类型(一)

179 阅读2分钟

这是我参与11月更文挑战的第2天,活动详情查看:2021最后一次更文挑战

undefined和null是所有类型的子类型, 就是说任意类型都可以被赋值为undefined和null

当不确定入参的时候, 可以用::any 任意类型::,当用了any的时候就不会有属性和方法的提示了(ide不知道这个变量是什么数据类型), 如果是方法,返回值也是any类型

let number: number = undefined
let notSure: any = 4
notSure = 'string'
notSure = true
notSure.myName()

联合类型

当一个变量可能是number或者是string的时候, 这时候就轮到了。

let numOrStr: number | string = 123
numOrStr = '123'

数组

let arrOfNumbers: number[] = [1,2,3]

类数组, 在TS中已经被固定好了类型

Image.png

Tuple元组 起源于函数式编程 不能缺省,限定数据类型

let user:[string, number] = ['an',22]

interface 定义Object类型 。

interface IPerson {
    name: string;
    age:number
}
let an: IPerson = {
    name:'an',
    age:22
}

可选属性

在名称后面加个? sex可有可无 可选参数要放在必选参数的后面

interface IPerson {
    name: string;
    age: number,
    sex?: string
}
let an: IPerson = {
    name:'an',
    age:22
}
  • 只读属性 在不允许修改的属性前添加readonly, 比如id。
interface IPerson {
	readonly id: number;
    name: string;
    age: number,
    sex?: string
}

类似const, 不同的是readonly用在对象的属性上,而const是用在变量上的。

函数

function add(x: number, y: number, z?: number): number {
    if (typeof z === 'number'){
        return x+y+z
    } else {
        return x + y
    }
}

let res = add(2, 3)

变量声明函数

const add = (x: number, y: number, z?: number): number => {
    if (typeof z === 'number'){
        return x+y+z
    } else {
        return x + y
    }
}

这个add变量本身就是函数类型, 那怎么接受到add这个变量

const add = (x: number, y: number, z?: number): number => {
    if (typeof z === 'number') {
        return x + y + z
    } else {
        return x + y
    }
}

const add2: (x: number, y: number, z?: number)=>number = add

为什么add我们没有声明是什么类型,但是却需要对应类型接收add,这是因为TS中有类型推断,当你没有明确说明一个变量是什么类型的时候,TS会去推测,比如你先给变量赋值一个string类型,然后再赋值number类型就不行了。

Image.png

用Interface描述函数类型

function plus(a: number, b: number): number {
    return a+b
}
interface IPlus{
    (a:number,b:number):number
}
const a:IPlus = plus