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<number | string> = [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'))