持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第1天，点击查看活动详情

TypeScript基础语法

基本语法

原始类型

string类型 number Boolean null undefined symbol

const a:string="1111"
const a:number=111//包括NAN Infinity

object类型

object类型不单单指定对象，还可以指定数组或者函数

const obj1:object={}
const obj2:object=[]
const obj3:object=function(){}

注意：如果只想指定为对象，如下，对象属性都要提前声明好类型：

cosnt obj:{name:string,age:number}={
name:"张三",
age:15
}

声明数组类型

1.可以指定声明Array且通过<>指定元素类型，比如指定声明元素都为数字的数组：

const arr:Array<number>=[1,2,3]

1. 用普通的数值类型number声明数组，如下：

const arr1:number[]=[1,2,3]

声明元组类型

就是要提前指定数组里面每个元素的类型，严格一一对应

const arr3:[string,boolean,number]=["111",true,1111]

声明枚举类型

t通过关键字enum声明一个枚举类型：如：

enum statu={
 pedding=1,
 resolve="2",
 reject=3
}
//访问
console.log(statu.pedding)//1

函数参数和返回类型

函数声明式

指定函数传入类型参数类型，指定返回值类型，调用时传入参数个数与类型都必须相同：

括号里指定每个参数类型，括号右边指定返回值的类型

function aaa(name:string,age:number):string{
  return "aaaa"
}
aaa('张三',18)

如果传入参数不确定传不传，那么可以给参数加个“?”，表明他是可选的：

function aaa(name:string,age?:number):string{
  return "aaaa"
}
aaa('张三')

或者给参数添加默认值，那也会成为可选参数：

function fun(name:string,age:number=2):string{
  return "sss"
}

如果参数个数不确定，可以用扩展运算符加解构赋值表示，当然传入与指定类型一致的：

function fun(name:string,age:number=14,...res:number[]):string{
return 'aaa'
}

函数表达式：

const fun2:(name:string,age?:number)=>string=function(name:string,age:number){
return 'aaaa'}

任意类型

通过指定any关键字表示任意类型，跟原来js一样，可以任意赋值不同类型的值

function fun(name:any):any{
 return name
}
fun('aaa')或者func(aaa)都可以

let num:any=1
num='aaa'
num=true

类型断言

类型断言就是明确告诉typescript这个变量就是某种类型的，百分之百确定。不用typescript在有些情况下要自己推断某些没有明确定义或者多边的场景是什么类型：

可以通过as+类型，断言它就是某种类型的

const res=1
const num=res as number

接口基本使用

基本语法

接口可以理解为一种规范，一种契约。可以约束一个对象里应该有哪些成员，这是成员是什么类型，有什么功能：

通过interface 定义一个post接口，这个接口是一个对象，规则为有一个name为string类型，age为number类型

interface Post{
  name:string,
  age:number
}
funtion printPost(post:Post){
 post.name
 post.number
}

接口属性

可选属性只要在属性名后加**？**，

只读属性在属性名前加readonly，

interface Post{
  name?:string,
  readonly age:number
}

如果连成员属性名称都不确定，那么可以声明动态成员，要指定成员变量名字类型和成员值的类型，如：

interface Post{
 [prop:string]:string
}
const post:Post={name:"张三",age:"111"}