TypeScript

• 作用：TS可以让我们在编写的时候就发现报错，可以更早发现错误，随时随地的提示你
• 使用：

• • 安装：

• • • npm i -g typescript
    • yarn global add typescript

原始类型

有 ：数字类型number ，字符串类型string，null类型，undefined类型，boolean类型

-------------------------------------------------------------

数组类型

语法: let 数组名 : 类型[] = []

let arr: number[] = [1,2,3]
let arr1 : number[] = [4,5,6]

--------------------------------------------------------------

对象类型

语法： let 对象名 ：{ k:类型 ; k2:类型 } = { k:'你好', k2:'22' }

let arr3 : { name: string; age: number; isShow: boolean } = {
  name: '你好',
  age: 22,
  isShow:true
}

----------------------------------------------------------------

联合类型

语法 : let 数组名 ：(类型 | 类型) [] = [1,2,3,4]

let arr3 : (number | string) []= [1,'哦哦哦','3']
let arr4 : (number | string) [] = ['10' , '伦理aa , '2 , 1] 

---------------------------------------

函数类型

普通函数

语法：function 函数名 (参数1: 类型 , 参数2: 类型): 返回类型 { return ...}

function  add ( num:number ,num2:number ): number {
return num + num2
}
console.log(add(10 , 20))

箭头函数

语法：const 函数名 = ( 参数1：类型 , 参数2 : 类型) : 返回类型 =>{ retuen... }

const add = (num3: number ,num4:number) : number =>{
return num3 + num4
}
console.log(add(10 , 20))

函数类型+类型别名方式 (常用)

语法：①先type类型别名一个 定义好的类型， ②然后在箭头函数中使用： const 函数名 : 类型别名 = (参数1 ， 参数2) =>{ return .... }

type fntype = ( num1 : number , num2 : number) => number
const add : fntype = (num1 , num2) =>{
 return num1 + num2
}

void类型

调用函数时 可以触发函数内的东西 但是 没有返回值，所以没有返回值的 默认类型也是 void类型

const sat = ( ) : void =>{
   console.log('hi')
}
——-------------------------------
没有返回值的这种情况都是默认就有 void
const sat2 = () =>{
 console.log('2')
}

可选参数

声明为可选参数的函数参数可以被省略。被标记?的就是可以省略的 但是必传的值必须在可选的前面

const sat = ( num:numger , num2?:numger ) =>{
 sat(2)   //返回值是 2 , undefined。且不会报错
}

-----------------------------------------

对象类型

语法：let 对象名 : { k:类型 ; k2:类型; k3:类型; k4:类型 } = { k:'112' , k2: 22 , k3: true , k4 : undefined}

let sat : {  nume : string ; age : numger ;  isShow :  boolean ; unde : undefined} = {
name:' 稿件1',
age:'22',
isShow: true,
unde: undefined
}

----

扩展用法之 对象类 + 类型别名 + 可选

type dx = {

    name:string

    age:number

    /* 非必传 如果不打?下面就会报错 打了就可以不传也不会报错 */

    fbc?:{aa:number, ss:string}
}
/* 这里用了类型别名 */

let sat:dx = {

    name:'啦啦啦',

    age:22

}

let sat2:dx = {

    name:'阿打算打算的',

    age:33

}

-----------------------------------------------------

interface 接口函数

interface xxx {
  a:number
  fn=()=>void
}

接口函数具备一些特点

特点一** 继承 (extends)**

继承例如： interface xxx2 extends xxx {

}

特点二** 可重复定义(累加) **W

interface xxx {

x:string

}

interface接口函数联合用法 继承 加 累加

interface xxx2 extends xxx {
   zz : numger
}

type 和 interface 的区别是

type 关键字可以用于 创建基本类型，对象类型，联合类型，交叉类型等， 而 interface只能用于创建对象类型

interface 可以做到合并 但是type定义相同名称的合并就会报错

-----------------------------------------------------------------------

字面量

比如 男女 只有这两种值 可以选 我们就 '男', '女'

------------------------------------------------------------------------

泛型

泛型函数 --- function fn<T>(set:T) : T{ return set } 调用 fn<number>(1)

语法 ：function 函数名<T>(传入值:T) : T{return 值}

-----

泛型对象 -- 在对象中如果还有data对象里面装着什么 我们不知道 所以可以用泛型方法

type obj<T> = {
        suatus:number
        message: string
        data: T
}

以后将data中的值都设置好数据类型再传进去就行了

let xxx : obj<{id:string ; name:string}>

------

泛型接口 -- 一样的

interface obj<T> {
     suatus:number
        message: string
        data: T
}

let xxx : obj<{id:string ; name:string}>