Typescript 合并接口

在TypeScript中,合并接口(Interface Merging)是一種強大的特性,它允許你擴展現有的接口,無論是通過聲明合并還是在同一個聲明塊中直接擴展。這種特性在基于類的面向對象編程中非常有用,但TypeScript的接口合并也適用于函數、枚舉等。

1. 在同一個聲明中合并接口

你可以在同一接口聲明中直接添加新的屬性或方法。然而,這并不是通常所說的“合并接口”,因為它不涉及多個接口聲明的合并。不過,了解這一點有助于理解接口擴展的基礎。

interface Animal {name: string;eat(): void;
}// 這不是合并接口,但展示了如何擴展接口
interface Animal {sleep(): void;
}// 現在Animal接口包含 name, eat, 和 sleep

注意:在TypeScript中,如果接口名相同,則后聲明的接口會覆蓋前聲明的同名屬性或方法(如果有沖突的話),但這并不是合并接口的典型用法。

2. 聲明合并接口

聲明合并允許你將多個接口聲明合并為一個單一的接口。這是通過為相同的接口名創建多個接口聲明來實現的,每個聲明都貢獻了一些新的成員。

interface Box {height: number;width: number;
}interface Box {scale(n: number): Box;
}// 合并后的Box接口
let box: Box = {height: 5, width: 6, scale: (n) => box};

在這個例子中,Box接口首先被定義為包含heightwidth屬性。然后,我們再次聲明了Box接口,這次添加了scale方法。最終,Box接口將包含heightwidthscale方法。

3. 合并全局接口

你還可以合并全局作用域中的接口,這在為現有的庫或全局對象添加類型定義時特別有用。

interface Array<T> {myConcat(...items: T[][]): T[];
}Array.prototype.myConcat = function<T>(this: T[], ...items: T[][]): T[] {return [...this, ...items.flat()];
};const myArray = [1, 2, 3];
console.log(myArray.myConcat([4, 5], [6])); // 輸出: [1, 2, 3, 4, 5, 6]

在這個例子中,我們通過為Array接口添加一個新的myConcat方法來擴展了全局的Array接口。注意,我們還需要在全局作用域中(例如,通過修改Array.prototype)實現這個方法,以便在運行時可用。

注意事項

  • 合并接口時,如果兩個接口中有同名的屬性或方法,則后聲明的接口中的屬性或方法會覆蓋前聲明的。
  • 合并全局接口時要特別小心,因為這會影響到所有使用該全局接口的代碼。
  • TypeScript的接口合并特性提供了一種靈活的方式來擴展和自定義現有類型,而無需修改原始定義。

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/web/45320.shtml
繁體地址,請注明出處:http://hk.pswp.cn/web/45320.shtml
英文地址,請注明出處:http://en.pswp.cn/web/45320.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

4-2 權重衰減

前一節我們描述了過擬合的問題&#xff0c;本節我們將介紹一些正則化模型的技術。 我們總是可以通過去收集更多的訓練數據來緩解過擬合。 但這可能成本很高&#xff0c;耗時頗多&#xff0c;或者完全超出我們的控制&#xff0c;因而在短期內不可能做到。 假設我們已經擁有盡可能…

圖片轉文字的軟件,分享3種不同的類型的軟件!

在信息爆炸的時代&#xff0c;圖片作為一種直觀、生動的信息載體&#xff0c;已經成為我們日常生活中不可或缺的一部分。然而&#xff0c;有時候我們可能需要將圖片中的文字提取出來&#xff0c;以便于編輯、整理或進一步使用。那么&#xff0c;有哪些實用的圖片轉文字軟件可以…

2718. 查詢后矩陣的和

題目描述&#xff1a; 給你一個整數 n 和一個下標從 0 開始的 二維數組 queries &#xff0c;其中 queries[i] [typei, indexi, vali] 。 一開始&#xff0c;給你一個下標從 0 開始的 n x n 矩陣&#xff0c;所有元素均為 0 。每一個查詢&#xff0c;你需要執行以下操作之一…

Java-數據結構基礎

棧結構 : 先進后出 隊列結構 : 先進先出 數組結構 : 查詢快 , 增刪慢 鏈表結構 : 查詢慢 , 增刪快 二叉樹 二叉樹 : 每個節點最多有兩個子節點 二茬查找樹 : 每個節點的左子節點比當前節點小 , 右子節點比當前節點大 二茬平衡樹 : 在查找樹的基礎上, 每個節點左右子樹的高…

Django ORM中的Q對象

Q 對象在 Django ORM 中用于構建復雜的查詢條件&#xff0c;特別是當你需要使用邏輯運算符&#xff08;如 AND、OR、NOT&#xff09;時。以下是一些使用 Q 對象進行復雜查詢的實際例子。 Q對象使用 模型 假設我們有一個包含員工信息的模型 Employee&#xff1a; from djang…

一個引發openssl崩潰問題案例

1 背景 最近用libevent寫了一個https代理功能&#xff0c;在調研的時候&#xff0c;遇到了一個項目用到了本地多個openssl庫引發的ssl握手崩潰問題。 2 開發環境 項目庫版本號依賴項libeventlibevent-2.1.8-stableopenssl 1.1openssl1.0u / 1.1.1w / 3.3.1...... 3 問題現象…

Python酷庫之旅-第三方庫Pandas(024)

目錄 一、用法精講 61、pandas.to_numeric函數 61-1、語法 61-2、參數 61-3、功能 61-4、返回值 61-5、說明 61-6、用法 61-6-1、數據準備 61-6-2、代碼示例 61-6-3、結果輸出 62、pandas.to_datetime函數 62-1、語法 62-2、參數 62-3、功能 62-4、返回值 62-…

關于SQLException: Illegal mix of collations (`utf8mb4_general_ci,IMPLICIT`)...錯誤

希望文章能給到你啟發和靈感&#xff5e; 如果覺得文章對你有幫助的話&#xff0c;點贊 關注 收藏 支持一下博主吧&#xff5e; 閱讀指南 開篇說明一、基礎環境說明1.1 硬件環境1.2 軟件環境 二、報錯信息三、最后 開篇說明 記錄一個查詢錯誤 場景&#xff1a;數據庫之間某表復…

曠野之間 16 – AI 代理、AI 代理基礎設施、平臺和比較

在本文中&#xff0c;我們將研究 AI 代理、AI 代理基礎設施、市場上最流行的 AI 代理平臺、它們的比較以及 AI 代理的未來 我們將按以下順序討論這些主題 1. 關于人工智能代理 2. 人工智能代理在行業中的應用 3. AI代理基礎設施 4. 最受歡迎的 AI 代理平臺及比較 5.您將如…

【筆記】nginx命令

查看 啟動 通過./nginx啟動nginx之后 可以在虛擬機中進入/usr/local/nginx/html 去查看cat index.html 也就是此頁面的源代碼 進入vim /etc/profile 配置完之后保存退出 source /etc/profile 手動重載資源 隨后就可以在任意位置重載資源了 nginx -s reload 部署靜態資源就把靜…

兩項國際設計獎,支持雙設備—悠律Ringbuds pro開放式藍牙耳機體驗

在音頻設備領域&#xff0c;開放式耳機對比入耳式耳機的優勢就是既能聽到耳機內的聲音又能感知環境音&#xff0c;很適合在戶外以及辦公時使用&#xff0c;今天分享一款新品牌悠律UMELODY——悠律凝聲環Ringbuds pro&#xff0c;它采用氣傳導耳掛式設計&#xff0c;佩戴舒適、安…

【人工智能】 知識表示與推理(八數碼 + 傳教士與野人渡河)

目錄 一、八數碼難題 1. 需求分析 2. 數據結構、功能模塊設計與說明 2.1 算法思路 2.2 數據結構 3. 核心代碼與測試結果說明 3.1 核心代碼 3.2 測試結果說明 4. 存在的問題與體會 4.1 存在的問題 4.2 體會 二、傳教士與野人渡河 1. 需求分析 2. 數據結構、功能模…

基于EMQX+Flask+InfluxDB+Grafana打造多協議物聯網云平臺:MQTT/HTTP設備接入與數據可視化流程(附代碼示例)

摘要: 本文深入淺出地介紹了物聯網、云平臺、MQTT、HTTP、數據可視化等核心概念&#xff0c;并結合 EMQX、Flask、InfluxDB、Grafana 等主流工具&#xff0c;手把手教你搭建一個支持多協議的物聯網云平臺。文章結構清晰&#xff0c;圖文并茂&#xff0c;代碼翔實易懂&#xff0…

2024-07-14 Unity插件 Odin Inspector1 —— 插件介紹

文章目錄 1 介紹2 模塊3 學習目的 1 介紹 ? Odin Inspector 是 Unity 的一個插件&#xff0c;擁有強大、自定義和用戶友好的編輯器&#xff0c;而無需編寫任何自定義編輯器代碼&#xff0c;使得編程過程中的數據可視化更容易實現。 ? 具體功能包括&#xff1a; 更舒適美觀…

軟件設計師(中級)備考視頻教程

一、視頻介紹 本視頻主要包括軟件設計師系統學習教程&#xff0c;通過學習本視頻&#xff0c;可以幫助考生高效且深入地掌握軟件設計師資格考試核心知識&#xff0c;全方位覆蓋考試要點&#xff0c;從而輕松備戰考試。視頻不僅涵蓋了考試所需的全面知識體系&#xff0c;還通過直…

Linux--USB驅動開發(二)插入USB后的內核執行程序

一、USB總線驅動程序的作用 a&#xff09;識別USB設備 1.1 分配地址 1.2 并告訴USB設備(set address) 1.3 發出命令獲取描述符 b&#xff09;查找并安裝對應的設備驅動程序 c&#xff09;提供USB讀寫函數 二、USB設備工作流程 由于內核自帶了USB驅動,所以我們先插入一個U…

Google Colab 云端硬盤路徑讀取

加載云端硬盤 需要在左上角點擊這個文件圖標&#xff1b; from google.colab import drive drive.mount("/content/drive") # 掛載云端硬盤import os path"/content/drive/MyDrive/TextClassificationCustom" os.chdir(path) # 以路徑path作為當前工作目…

在 SwiftUI 中的作用域動畫

文章目錄 前言簡單示例動畫視圖修飾符使用多個可動畫屬性使用 ViewBuilder總結 前言 從一開始&#xff0c;動畫就是 SwiftUI 最強大的功能之一。你可以在 SwiftUI 中快速構建流暢的動畫。唯一的缺點是每當我們需要運行多步動畫或將動畫范圍限定到視圖層次結構的特定部分時&…

docker emqx 配置密碼和禁用匿名連接

mqtt版本emqx/emqx:4.4.3 1.首先把鏡像內目錄/opt/emqx/etc拷貝到本地 2.做映射 3.allow_anonymous&#xff0c; false改成true 4. 5.MQTTX連不上的話看看下圖的有沒有打開

【nginx】nginx的優點

目錄 一、高性能1.1 高并發處理1.2 低內存消耗1.3 快速響應 二、高擴展性2.1 模塊化設計2.2 動態模塊擴展 三、高可靠性3.1 核心框架穩定3.2 進程管理3.3 負載均衡與健康檢查3.4 熱部署 四、功能豐富4.1 反向代理4.2 HTTP緩存4.3 安全功能 五、易于配置和管理5.1 配置文件簡單5…