Ts类型介绍

Ts类型介绍

默认的原始类型

let a:number =10;
let str:string="hello";
let isShow:boolean=true;
let nullValue:null=null;
let undefinedValue:undefined=undefined;

Ts创建，接收数据中需要定义数据的类型，JS中不需要，默认定义了。

定义数组类型:
let arr: number[] = [1, 2, 3]

联合类型:
let arr: (number | string)[] = [1, ‘2’, 3, ‘4’]

释：数组中既有数字类型也有字符串类型

给定时器添加类型：

const timer: number | null = null

timer = setInterval(() => { }, 1000)

定时器编译后：

创建对象

空对象
let obj:{}={}

有属性的对象
let obj1:{name:string}={
name:‘小明’
}

有属性和方法的对象 第一种

函数，方法中fn(): void 不用箭头函数的方式

let obj2:{name:string;fn():void}={
    name:'vvv',
    fn(){}
}

有属性和方法的对象 第二种

多个换行隔开，函数中通过箭头函数 冒号 函数 void

// 函数使用箭头函数类型
let obj4: {
    name: string
    fn: () => void
} = {
    // 实际的内容
    name: 'ggg',
    fn() { }
}

编译后

创建函数

config 默认值 冒号 里面的参数，数据类型… 前提知道参数的情况下。

const axios = (config: { url: string; method?: string }) => { }

使用类型别名的方式创建函数

通过 type 定义数据的类型。

type Config = { url: string; method?: string }
const axios1 = (config: Config) => { }

编译后：

可选参数

在类型中，使用 参数？:类型 就是可选参数，可选参数必须写在必选参数后面。

var fn1 = (start: number, end?: number) => {
    console.log('小明');
}

函数类型介绍

使用函数形式 在函数中指定参数和返回值

//              参数+参数类型        ：返回值类型
function add(num1:number,num2:number):number{
    return num1+num2
}

使用箭头函数 指定参数和返回值

//              参数+参数类型        ：返回值类型
const add1=(num1:number,num2:number):number=>{
    return num1+num2
}

使用类型别名的方式

type addtype=(num1:number,num2:number)=>number

type addtype=(num1:number,num2:number)=>number

const add3:addtype=(num1,num2)=>{
    return num1+num2
}   

如果定义的函数没有返回值 就使用void Ts中不是undefined

const fn=(num:number):void=>{
    console.log('hello');
}

如果函数中没有返回值和定义函数类型 默认是void

直接箭头函数就可以。

const fn=()=>{
    console.log(1);   
}