亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

什么事interface

用于描述對象的結構和屬性。本身就是個類型

interface可以被實現(implements)或擴展(extends)。和類有關系。

什么是type

表示類型的別名。

它允許我們為任何類型創建別名。包括上面的interface也可以用類型創建別名。

type可以表示對象，聯合類型，交叉類型等，并且可以進行復雜的類型操作。

interface User{

? ? name:string

? ? age:number

}

type UserType={

? ? name:string

? ? age:number

}

type UserType1=User;

function fun(params:User):User{

? ? params.age

? ? return params;

}

這個函數這樣寫冒號后面的代表返回值，也可以用UserType.

上面那個是接口對象，下面的UserType是對象別名，右邊的是對象

有什么區別？

1，一個是結構，一個是別名

inerface可以擴展，type不能擴展。

interface Person extends User{

email:string

}? Person接口對象繼承User的屬性外，額外添加email的屬性。

2，interface重名會合并，type不能重名。

interface User{

? ? gender:string

? ? name:number

}

前面已經定義了name是string ,這里改成number會報錯。

3,interface可以被類實現，type不能。inteface就是接口對象，就是拿來被類實現的。用class的關鍵字就可以定義一個類

class Man implements User{

? ?

}

定義一個類叫Man,這個Man會報錯，讓你必須要去實現user里面定義好的屬性，不能不實現它。用一個接口對一個類要實現的東西進行約束

class Man implements User{

? ? name:string;

? ? age:number;

? ? gender:string;

? ? constructor(name:string,age:number,gender:string){

? ? ? ? this.name=name;

? ? ? ? this.age=age;

? ? ? ? this.gender=gender;

? ? }

}

這樣還是會報錯，會提示你必須要寫個構造器進行初始化。用一個叫Man的類實現了User的屬性。如果接口里面加了個函數，這個類里面也必須要有這個函數

4,type支持聯合類型和交叉類型，interface不支持

type可以定義一個兩個類型運算之后的別名，

type People=Man | Woman

|或的運算，只要符合一個就可以

interface Woman{

? ? age:number

}

interface Man{

? ? name:string

}

type People = Man | Woman

const p:People={

? ? //age:12,

? ? name:'jack'

}

Man | Woman就是聯合類型的，交叉類型用&符表示

type UserMan=Man & Woman

const u:UserMan = {

? ? name:'jack',

? ? age:12

}

必須兩個屬性都有

type可以進行簡單的聯合類型和交叉類型的運算

在日常工作中，定義描述結構的時候大多數用的是interface ，只有在要對類型做一個運算的時候才會用type.不知道用type還是用interface的時候，兩個都可以的時候，就用interface。

規范

1，定義類型首字母都要大寫，有的公司會要求在interface前面加個大寫的I，在type前面加個大寫的T，不推薦加這個，java里面經常用到。前端很少用到class。

利用枚舉類型如何實現表驅動法?

? ?（表驅動法幫助我們簡化代碼并且邏輯看上去更清爽）

????條件判斷語句很多的時候用if else哪怕是switch 可讀性都是很差的，不好看

用枚舉類型對它進行優化

枚舉類型用enum這樣一個關鍵字來修飾，跟對象很相似但是沒有=號，里面可以定義不同的狀態，用不同的變量去定義不同的狀態，方便別人閱讀，起到了文檔的作用。但還是有if else還是不夠簡潔，用表驅動就是為了干掉if,else和switch，因為那樣的寫法會把很多的邏輯耦合到一起。

表驅動，

定義一個對象，然后定義類型的時候用Record? ，高級類型，Record<number,(order:Order)=>void=>{}? record可以理解為js中object,key是number類型，value是function的類型，有點像映射，一對一。

數字枚舉

本身就是數字 不寫默認從0開始??OrderStatus3{Pending=3}

字符串枚舉

enum OrderStatus3{Pending="pending"}

易構枚舉

enum OrderStatus3{Pending,completed='completed'}

沒有指定的就是0,指定了的就變成了字符串，不定義的放中間就不行，因為它不知道從幾開始

枚舉成員的類型不能是function

enum Obj{a,b=Obj.a,c=Math.random(),d=1+2,e=()=>false}最后那個會報錯

//常量枚舉 并不會轉譯成任何的js代碼 ，只有在常量使用的時候才會進行轉譯，少生成JS代碼

const enum ConstOrderStatus{Pending,Shipped}

//基本的枚舉是會轉譯成js代碼的，會生成一個類似于對象的東西

enum ConstOrderStatus{Pending,Shipped}

ConstOrderStatus.Pending=233? 會報錯，是只讀的，不能這樣修改

常量枚舉和基本枚舉不能比較。其它枚舉不同的元素也不能進行比較

js的類型：

7種基本類型：boolean,number ,string ,null,undefined,symbol(es6),bigint(es10) 2020.

引用類型obj:arry,function,date

ts新增類型：

tuple 元祖

nver

any

void

其他高級類型

：+類型名字? 類型注解

重新定義類型會報錯

類型不同不能相互賦值

null只能賦值給null,undefined只能賦值給undefined? null不等于undefined;

Symbole()獨一無二的變量 命名沖突，私有屬性? 拿它解決

BigInt(322223112333);? number類型有精度限制，這個就是為了解決這個問題。大數不會失真

Tsconfig? target: ESNext? ?module:ESNext?

數組? :string[]? ?: Array<number|string>? ?聯合類型

元組 是特殊的數組? tuple:[string,number,boolean]=['a',1,false];

tuple.push('abc')

tuple[2]? 能加不能讀，不能夠越界，必須要是要一一對應

函數

fun1:(params:string)=>boolean=()=>false

function fun2(params:string):boolean{return false}

type Fun=(params:string)=>boolean;? 類型定義可復用

const fun1:Fun=()=>false;

const fun3:Fun=()=>true;

對象

const obj:object={a:1,b:2,}工作中不這樣定義 ，因為object比較泛，有點類似any了，類型越具體越好

const obj1:{a:string,b:string}={a:'1',b:'2'}

interface Obj {a:string,b:string}

const obj1:Obj={a:'1',b:'2'}

void 沒有任何返回值

const v=():void=>{}

any;如果都是any就和javascript沒有區別了

沒有加類型注解沒有加：默認就是any的 可以隨便的賦值? 盡量別使用any，使用any就放棄了類型的好處

let x;

x=1;

never? 永遠不會有返回值? ? 在業務代碼中很少用never? ?高級類型編程的時候會用到

const n1=():never=>{throw new Error()}?

const n2=():never=>{while(true){}}? 死循環卡這兒了

//? Record 工具類型實現原理

type RecordType<K extends string | number | symbol, T> = { [P in K], T }

const infoObj: Record<string,string> = { a:'a' }

索引類型，定義key：value，key和value可以定義為任何類型；通常定義數組對象

interface Person {

????name： string

????age: number

}

const personInfos: Person = { name: 'a', age: 16 }

// 》》》》》》》》》》 索引類型

interface Student {

????[id: number]: Person // id只是個站位符

}

const sudent: Student = {

? ? 0:{ name:'a', age: 1 }

}

// 映射類型

利用操作符 keyof typeof，根據已有類型創建新的類型

type Keys = keyof? Person // 'name' | 'age'? 聯合類型的字面量

typeof 針對的是 ---- 變量值

type Ty = typeof personInfos? //? ?--- { name： string; age: number }

interface 描述對象的結構及屬性

可以被實現class implements或者extends

interface User {

????name: string;

????age: number

}

// 類型別名

type UserType = User

// 繼承類型

interface Person extends User {

????sex: string

}

數字枚舉、字符串枚舉、異構枚舉

常量枚舉：不轉譯枚舉，代碼較少

每個枚舉屬性都是只讀的，不能賦值

tuple

push可以突破限制，但是讀取不到

const arr: [number,string] = [1,'test'];

arr.push(66);

arr[2]; // 語法錯誤

函數類型：箭頭函數（推薦）+ 函數語句

類型別名?

type Func = (p:string) => boolean;

const func1: Func = ('test') => true;

function func2(p:string):boolean{

????return true

}

any: 任何類型，放棄類型檢查

never：永遠沒有返回值

const f1 = () :never? => {

????throw new Error() // 終止進程

????// 或者

????while(true){

????????//? 無限循環

????}

}

fan

aa

類型保護

表驅動

有code 和message

泛型

映射類型

typeof只能是值或者枚舉

索引