typescript新增类型上开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第26天，点击查看活

开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第26天，点击查看活动详情

ts新增类型有

联合类型
自定义类型(类型别名)
接口
元组
字面量类型
枚举
void
.....等等

1.联合类型

当一个数组中既是string,也可以是number类型时怎么实现呢?

这时就要使用联合类型啦

语法 :

类型1 | 类型2 | 类型3....

eg:

// 定义一个变量，类型是number 或者 null
let timer: number | null = null
timer = setInterval(() => {}, 1000)

// 定义一个数组，数组中可以有数字或者字符串
// 需要注意 | 的优先级
let arr: (number | string)[] = [1, 'abc', 2]

2.自定义类型(类型别名)(重点)

格式:

定义 type 别名 = 类型

type s = string // 定义  

const str1:s = 'abc'

const str2:string = 'abc'

2-1自定义类型

type 新类型 = 类型1 | 类型2 | 类型3

给复杂类型起别名是一般首字母大写

一看就知道原先的写法只有一行代码,简洁,但建议不用, 因为给它起了别名利于复用

type MyArr = (number | string) [] 
const arr:MyArr = [1, '1'] 

//原先写法
const arr:(number | string) [] = [1,'1']

2-2自定义对象 -- 参数可选(对象) ?

type MyGir1 = {
    address?:string,  //对象可选
    name:string,
    age:number, 
    //hello的类型,是一个函数,没有形参,返回一个string
    hello?:() => string // hello: () => {}
    greet?():void ,  //greet: function() {}
  }
  let g1 : MyGir1 = {
    greet: function(){

    },
    hello:function(){
      return 'abc'
    },
    age:18,
    name:'小红',
    address :'无'
  }
  let g2: MyGir1 ={
    age:30,
    name:'小明',
    //address:'地球上'
  }
  const fn =(h:MyGir1) =>{
    h.address = '按地方'
  }

2-3函数参数可选

 //若设置,有个可选,有个不选 (a:number,b? :number)
  const f = (a?:number,b?:number) => {}
  f()
  f(1,2)
  f(1)

  //设置了默认值,是不是表示这个值  可传不可传 ===> 可选
  const fn =(x:number =1 ,y : number =2) => {
    return x + y
  }
  //让参数是可选的,只要添加一个特殊的符号 ? 
  fn()  // ===> 3
  fn(10)  // ===> 12

3.void

void : 如果函数没有返回值,设置为void格式

1.不在乎返回值

2.return 空的

3.return undefined

 //普通函数
  function fn(a:number,b:string):void {
    //return 
    //return 1  报错
    return undefined
  }
  const abc = fn()

  //箭头函数
  const f = ():void => {}
  //自定义函数
  type MyFn = () => void
  const f1:MyFn = () => {}

typescript新增类型 上