typeScript的数据类型（附代码解析）

注：本篇适合初学TS的宝宝们，众所周知，TS的写法对于数据类型要求比较严格，同时可维护性比较好，所以很多大厂提倡用TS书写代码，那么，初学代码的时候几乎都是从数据类型方面入手，长话短说，下面是一张ES6中常用的数据类型和typeScript数据类型的比对，通过对比可以发现后者要比前者多几种类型，那么本篇将主要以代码的方式去演绎类型

下面将会列举一下TS常用数据类型的不同写法

TS基本类型

//原始类型
let bool: boolean = true
let num: number = 123
let str: string = 'abc'

//数组
let arr1: number[] = [1,2,3]
let arr2: Array = [1,2,3,'4']

//元组   特殊的数组
let tuple: [number,string] = [0,'1']

//函数
let add = (x:number,y:number)  => x+y
let compute: (x:number,y:number) =>number
compute = (a,b) => a+b

//对象
// let obj: object = {x:1,y:2} 如果写成这种代码obj.x找不到这个值
let obj: {x:number,y:number} = {x:1,y:2} 
obj.x = 3

//symbol  具有唯一的值
let s1: symbol = Symbol()
let s2 = Symbol()
console.log(s1 === s2) //false

//undefined ,null
let un: undefined = undefined  //如果声明了undefined不能赋值为其他数据类型 ，但是可以赋值给undefined类型
let nu: null = null

//void 操作符 任何表达式返回undefined   viod 0
let noReturn = ()=> {}

//any  相当于js的写法
let x
x=123
x=[]
x=()=>{}

//never  永远不会有返回值的类型
//1.抛出异常
let error = ()=> {
 throw new Error("error")
}
//2.创建死循环函数
let endless = ()=>{
  while(true) {}
}

TS的高级类型

枚举类型：enum (一组有名字的常量集合)

//数字枚举  只读，但是不可以修改
enum Role {
  Reporter = 1,
  Developer,
  Maintainer,
  Owner,
  Guest
}
//如果没有默认值，那么索引值从0开始，否则从默认值往下递增
// console.log(Role)

//字符串枚举
enum Message {
  Success = '恭喜你，成功了',
  Fail = '抱歉，失败了'
}

//异构枚举  数字和字符串混用
enum Answer {
  N,
  Y = 'yes'
}

接口: interface

interface Lib {
  (): void;
  version: string;
  doSomething(): void;
}

function getLib(){
  let lib: Lib =(() =>{}) as Lib  ;//类型断言
  lib.version ='1.0';
  lib.doSomething =()=> {}
}

let lib1 = getLib;
lib1();

interface StringArray {
  [index: number]: string
}

let chars: StringArray = ['A','B']

函数：function

//下面几种写法表达上是一致的
function add1(x: number, y: number){
  return x+y
}

let add2: (x: number, y: number) => number
type add3 =  (x: number, y: number) => number

interface add4 {
  (x: number, y: number): number
}
//可选参数：加上问号  必须放在必选参数之后
function add5(x: number, y?: number){
  return y? x=y: x
}
add5(1)
//有初始值的函数
function add6(x: number, y=0,z:number,q=1){
  return x+y+z+q
}
add6(1,undefined,3)

function add7(x:number,...rest:number[]){
  return x+rest.reduce((pre,cur)=>pre+cur)
}
console.log(add7(1,2,3,4,5))

//函数重载 常用来实现功能类似而所处理的数据类型不同的问题
function add8(...rest: number[]): number;
function add8(...rest: string[]): string;
function add8(...rest: any[]): any{
  let first = rest[0]
  if(typeof first === 'string'){
    return rest.join('')
  }
  if(typeof first === 'number'){
    return rest.reduce((pre,cur)=>pre+cur)
  }
}
console.log(add8(1,2,3))
console.log(add8('a','b','c','d'))

长按二维码

关注我们吧