Redmi Pad評測：紅米充滿野心的一次嘗試
從Note系列到K系列，從藍牙耳機到筆記本電腦，紅米不知不覺之間也已經(jīng)形成了自己頗有競爭力的產(chǎn)品體系，在中端和次旗艦市場上甚至要比小米新機的表現(xiàn)來得更好，正所謂“大丈夫生居
在學習和使用 ts 的時候，有一個語法會大量的出現(xiàn)，他就是 extends。但是這個語法放到 ts 里，就顯得非常怪異，因為好多時候跟我們常規(guī)的理解看上去好像不太一樣，不就是一個繼承嗎，咋到處都在亂用啊？
實際上，之所以怪，是因為在 ts 中，extends 不只是要表達繼承的意思，他還有一些延展含義。
在 JS 核心進階中，我們在學習設計模式的時候，曾經(jīng)提高過一個原則：里氏替換原則，該原則針對的是父類與子類之間的替換關系：任何使用父類實例的地方，都能夠使用子類實例完美替換。
class Person { constructor(name) { this.name = name } run(t) { console.log(`${this.name} 跑了 ${t} 公里`); }}class Student extends Person { constructor(name, grade) { super(name) this.grade = grade }}const p1 = new Person('Tom')p1.run(20)const s1 = new Student('Tom')s1.run(20)這個案例中，我們能夠使用 s1 去替換 p1。而不會出現(xiàn)什么問題。
在 ts 的類型兼容性里，也符合這個原則。基于這個邏輯，我們就可以把 extends 作為一個判斷條件，來驗證你是否合理運用了里氏替換原則，從而衍生出它新的用法。
繼承的運用非常的常規(guī)。在面向?qū)ο蟮倪\用中，我們可以繼承一個父類。
class Parent {}class Children extends Parent {}我們也可以在 interface 的類型聲明中，使用繼承。
interface Animal { kind: string}interface Dog extends Animal { bark(): void}它等價于。
interface Dog { kind: string bark(): void}我們先簡單來看一下這個東西是如何在泛型中使用的，然后再來結(jié)合里氏替換原則來分析它的邏輯。
interface Dispatch<T extends { type: string }> { (action: T): T}我們在定義 Dispatch 時需要傳入一個泛型，傳入的泛型類型必須與 {type: string} 符合里氏替換原則。意思就是說，要傳入該類型的子類型。
因此，我們可以傳入。
var action = { type: 'get/list', playload: 10}也可以傳入。
var action = { type: 'merge'}var action = { type: 'add', value: { a: 1, b: 2 }}從結(jié)論上來看，父類型的約束力度更小，子類型的約束力度更大。
我們可以可以繼續(xù)衍生，當子類型與父類型符合正常的繼承關系時，判斷結(jié)果為 true，否則為 false。
這里的繼承關系，表達的是一種替換關系，或者說是約束力度的縮小。
type C = A extends B ? string : number這里表達的含義是，當 A 能夠替換 B 時，判斷結(jié)果為 true，否則，判斷結(jié)果為 false。
interface Person { name: string}interface Yung extends Person { gender: string}interface Student extends Yung { age: string}也就是說，當 A 作為 B 的子類型時，判斷結(jié)果為 true。
// 此時判斷結(jié)果為truetype C = Yung extends Person ? number : string // number// 此時判斷結(jié)果為falsetype C = Yung extends Student ? number : string // string也可以結(jié)合泛型使用。
type P<T> = T extends string ? string : numbertype Z = P<string> // string當我們在使用泛型的時候，會出現(xiàn)一些問題，看一下這個例子。
type A = number | string extends string ? string : number // number因為 string 的約束力度，比 number | string 更大，因此這里的條件判斷為 false，但是當我們通過泛型來做到同樣的事情時，情況就發(fā)生了變化。
type P<T> = T extends string ? string : numbertype A = P<number | string> // string | number當我們用泛型傳遞時候，跟預想中的不太一樣，這里會把泛型傳入的 number 和 string 拆分之后在去運行 extends 判斷。因此最后的結(jié)果是 string | number。
聯(lián)合類型在泛型中的表現(xiàn)是分配之后再傳入。
在實踐中一定要警惕這個小小的差異。我們可以使用如下的方式避免這種先分配再傳入的規(guī)則。
type P<T> = [T] extends [string] ? string : numbertype A = P<number | string> // numbernever 表示所有類型的子類型，因此也被看成是一個聯(lián)合類型，當我們在泛型中傳入 never 時也會同理出現(xiàn)同樣的問題。
type P<T> = T extends string ? string : number// 沒有類型可分配，直接返回 nevertype A = P<never> // never注意他們的不同。
type P<T> = [T] extends [string] ? string : numbertype A = P<never> // string現(xiàn)有一個對象 A 有很多個屬性，我希望重新定義一個新的對象 B，該對象的屬性是從 A 里挑選出來的，那么 B 的類型應該怎么定義呢。
interface A { name: string; age: number; gender: number; class: string}當然，我們可以用常規(guī)的方式來定義，不過有的時候這樣會比較麻煩。
interface B { name: string, age: number}我們也可以利用泛型和 extends，定義一個 Pick 類型。
type Pick<T, K extends keyof T> = { [P in K]: T[P]}type B = Pick<A, 'name' | 'age'>當我們在 Pick 中傳入 A 時， keyof A 的結(jié)果為 name | age | gender | class，因此 'name' | 'age' 是 keyof A 的子類型。
此時的 B 得到與上面寫法一樣的結(jié)果。
現(xiàn)在我有一個聯(lián)合類型。
type a = 'name' | 'age' | 'gender' | 'class'我希望排除其中一個 name，得到一個新的聯(lián)合類型。
type b = 'age' | 'gender' | 'class'此時我們可以定一個排除的泛型類型來做到這個事情。
type b = Exclude<a, 'name'>這個 Exclude 是如何實現(xiàn)的呢？非常的簡單。
type Exclude<T, U> = T extends U ? never : Ttype b = Exclude<a, 'name'>我們來分析一下，首先剛才我們已經(jīng)知道，當傳入的泛型為聯(lián)合類型時，會先分配再傳入。
因此，此時傳入的聯(lián)合類型 a 會被拆分傳入。
也就是說，T exnteds U 的比較會變成。
// never'name' extends 'name' ? never : 'name'// age'age' extends 'name' ? never : 'age'// gender'gender' extends 'name' ? never : 'gender'// class'class' extends 'name' ? never : 'class'所以通過這種方式，我們可以做到從聯(lián)合類型中排除指定的類型。
Omit 是 Pick 的取反，表示挑選剩余的屬性組成新的對象。理解了 Pick 和 Exclude，這個理解起來非常容易。
type Omit<T, K> = Pick<T, Exclude<keyof T, K>>使用：
interface A { name: string, age: number, gender: number, class: string}type B = Omit<A, 'name'>等價于：
interface A { age: number, gender: number, class: string}大家可以自己分析一下 Omit 的實現(xiàn)原理，應該是沒有任何難度的。
最后來個騷的，大家分析一下這玩意兒有什么用
type TypeString<T> = T extends string ? "string" : T extends number ? "number" : T extends boolean ? "boolean" : T extends undefined ? "undefined" : T extends Function ? "function" : "object";本文鏈接：http://m.www897cc.com/showinfo-26-87003-0.htmlTypeScript 中的 Extends 怎么那么優(yōu)秀啊？
聲明：本網(wǎng)頁內(nèi)容旨在傳播知識，若有侵權(quán)等問題請及時與本網(wǎng)聯(lián)系，我們將在第一時間刪除處理。郵件：2376512515@qq.com
Copyright ? 2016-2023 天津谷騏科技有限公司 版權(quán)所有 sitemap.xml
違法及侵權(quán)請聯(lián)系：2376512515@qq.com 津ICP備18001702號
津公網(wǎng)安備 12010102000574號