ts中type和interface類型聲明的區別

1. 寫法上

type 使用關鍵字 type 進行聲明。
interface 使用關鍵字 interface 進行聲明。

// 使用 type
type MyType = {param: string;
};// 使用 interface
interface MyInterface {param: string;
}

2. 可合并性

interface 具有可合并性,允許在同一作用域內多次聲明同名的接口,這些聲明將會合并為一個接口。
type 不具有可合并性,如果多次聲明同名的類型,會報錯。

// interface 具有可合并性
interface MyInterface {param: string;
}interface MyInterface {additionParam: number;
}// 最終合并后的接口
// { param: string; additionParam: number; }

3. 拓展性

interface支持接口的擴展(extends關鍵字)。
type 支持聯合類型交叉類型,但不能使用 extends關鍵字 進行擴展。

// 使用 interface 擴展
interface ExtendedInterface extends MyInterface {newParam: string;
}// 使用 type 交叉類型
type ExtendedType = MyType & { newParam: string};

ts類型操作符& 和 | 的區別

4. 接口的實現

class 可以用implements實現一個接口。
type 不能被類實現。

// 使用 interface 實現
interface MyInterface {prop: string;
}class MyClass implements MyInterface {prop = "value";
}

5. 使用場景

一般來說,interface 更適合聲明一個對象

interface Person {name: string;age: number;greet(): void;
}const person: Person = {name: 'John',age: 30,greet() {console.log('Hello!');}
};

type更適合表示聯合類型、交叉類型和其他高級類型,創建類型別名

type Status = 'success' | 'error';type Coordinate = {x: number;y: number;
};type Point3D = Coordinate & { z: number };type FunctionType<T> = (arg: T) => void;

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

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

相關文章

045:Vue讀取本地上傳JSON文件,導出JSON文件方法

第045個 查看專欄目錄: VUE ------ element UI 專欄目標 在vue和element UI聯合技術棧的操控下&#xff0c;本專欄提供行之有效的源代碼示例和信息點介紹&#xff0c;做到靈活運用。 &#xff08;1&#xff09;提供vue2的一些基本操作&#xff1a;安裝、引用&#xff0c;模板使…

jquery手寫廣告輪播圖,無限循環功能

說明 在很多情況下&#xff0c;我們都需要開發廣告輪播圖&#xff0c;當我們進行頁面的功能開發時&#xff0c;采用輪播圖來實現也行&#xff0c;但是很多情況下&#xff0c;我們只需要簡單的控制輪播循環輪播展示即可&#xff0c;所以用jq開開發廣告輪播波&#xff0c;自定義…

spring更加松散的獲取bean的方式ObjectProvider

概述 ObjectProvider直譯就是對象提供者; 平時從spring中獲取bean都是調用beanFactory.getBean()方法&#xff0c;如果bean不存在則會直接拋異常; 從spring 4.3開始引入了org.springframework.beans.factory.ObjectProvider接口,其提供了若干的方法&#xff0c;可以更松散的…

Idea 插件開發: Swing Designer設計器創建的組件全部為空問題記錄

問題現象 通過Swing 設計器創建的對象, Swing組件全部是空的, 導致ToolWindowFactory工廠的實現類調用時候出現了空指針異常 如下方式創建的 問題分析 問題出現時候, 同時給我生成了一個createUIComponents的私有方法, 由于個人當時理解有誤, 把他當成了初始化方法, 在里面…

Oracle高可用一家老小全在這里

&#x1f4e2;&#x1f4e2;&#x1f4e2;&#x1f4e3;&#x1f4e3;&#x1f4e3; 哈嘍&#xff01;大家好&#xff0c;我是【IT邦德】&#xff0c;江湖人稱jeames007&#xff0c;10余年DBA及大數據工作經驗 一位上進心十足的【大數據領域博主】&#xff01;&#x1f61c;&am…

用Java實現一對一聊天

目錄 服務端 客戶端 服務端 package 一對一用戶; import java.awt.BorderLayout; import java.io.BufferedReader; import java.io.IOException; import java.io.InputStreamReader; import java.io.PrintWriter; import java.net.ServerSocket; import java.net.Socket; imp…

s3-dist-cp 介紹教程示例使用方法

s3-dist-cp 是 AWS EMR 內置的用于 S3 和 HDFS 之間文件拷貝的專用工具,與 Hadoop 的 distcp 類似,也是通過 Map-Reduce 作業的方式實現分布式的文件復制(distcp 就是 distributed copy 分布式拷貝的意思)。 s3-dist-cp 并不是一個簡單的在 S3 和 HDFS 之間拷貝文件的工具…

SpringBoot中MyBatis-Flex的集成和使用

一、MyBatis-Flex 是什么? MyBatis-Flex是一個基于MyBatis的數據訪問框架&#xff0c;專門為Flex應用程序而設計的。它提供了一種靈活而高效的方式來處理Flex應用程序中的數據訪問&#xff0c;可以輕松地連接到各種數據源&#xff0c;并提供了一些方便的工具和功能&#xff0c…

虛擬機和主機間復制粘貼

文章目錄 前言一、版本介紹二、安裝工具1.確認配置2.安裝工具3.重啟 總結 前言 在Windows中使用虛擬機&#xff0c;可以很方便地linux&#xff0c;就像是在本地操作服務器一樣。 一、版本介紹 虛擬機&#xff1a;VMware 15 操作系統&#xff1a;CentOS 7 二、安裝工具 1.確…

delphi android打開外部文件,報錯android.os.FileUriExposedException解決方法

Android 7.0強制啟用了被稱作 StrictMode的策略&#xff0c;帶來的影響就是你的App對外無法暴露file://類型的URI了。 如果你使用Intent攜帶這樣的URI去打開外部App(比如&#xff1a;打開系統相機拍照)&#xff0c;那么會拋出FileUriExposedException異常。 Delphi 為Android…

C++(14):通過tuple在構造對象時注入類型不確定的對象/插件

有的時候我們需要在構建對象時注入一系列類型不確定的對象或插件,怎么才能實現呢? #include <iostream> #include <string> #include <tuple>using namespace std;class A{ public:A(int a) : m_a(a){cout<<"construct A:"<<m_a<…

windows系統安裝RocketMQ_dashboard

1.下載源碼 按照官網說明下載源碼 官網 官網文檔 2.源碼安裝 2.1.① 編譯rocketmq-dashboard 注釋掉報錯的maven插件frontend-maven-plugin、maven-antrun-plugin mvn clean package -Dmaven.test.skiptrue2.2.② 運行rocketmq-dashboard java -jar target/rocketmq-…

Qt基礎-connect函數詳解

本文詳解Qt的connect函數用法。 目錄 定義 形式 函數原型 實例說明 定義 Qt中的信號槽為核心內容,一定要熟練掌握。鏈接信號使用connect函數。 QObject::connect函數,顧名思義,鏈接函數,作用是鏈接信號(signal)和槽(

tamcat亂碼

學習springmvc時tamcat亂碼 ①、啟動時tomcat控制臺亂碼 解決方法是&#xff1a;1、先把idea設置里的默認字節碼改成utf-8 ? 2、把idea顯示編碼改成utf-8&#xff0c;在末尾加上&#xff08; -Dfile.encodingUTF-8&#xff09; ? 3、最后重啟idea 加上這個 -Dfile.encodingU…

CSS基礎概念之選擇器類型

CSS選擇器類型 選擇器表示元素在樹結構中的特定模式。選擇器(selector)術語指的是&#xff0c;簡單選擇器(simple selector)&#xff0c;復合選擇器(compound selector)&#xff0c;復雜選擇器(complex selector)&#xff0c;或者選擇器列表(selector list)。選擇器的主題是任…

【軟考中級——軟件設計師】備戰經驗 筆記總結分享

考試成績 我第一次備考是在2022 然后那時候取消了這次是第二次 靠前我一個月復習的看了以前的筆記 然后刷了七八道歷年題目學習資料推薦 &#xff1a;zst——2021 b站鏈接自薦一下我的筆記 &#xff1a; 軟考筆記專欄 視頻確實很長 &#xff0c; 我的建議就是先看筆記 然后不會…

OD機考真題搜集:歡樂的周末

題目 小華和小為是很要好的朋友,他們約定周末一起吃飯。通過手機交流,他們在地圖上選擇了多個聚餐地點(由于自然地形原因,部分聚餐地點不可達),求小為和小華都可以到達的聚餐地點有多少個? 輸入 第一行輸入m,n,分別代表地圖的長度和寬度 第二行開始輸入具體地圖信息…

1-2、Java環境搭建

語雀原文鏈接 文章目錄 1、JDK安裝2、Hello World2-1、Hello World示例2-2、類名和文件名2-3、注釋2-4、javadoc 3、環境變量3-1、Path作用3-2、classpath3-3、JAVA_HOME 4、Java組成5、跨平臺原理5-1、Java跨平臺原理5-2、C語言的跨平臺原理 1、JDK安裝 下載地址&#xff1a…

打造Github首頁的動態飛線效果

一、導語 Github首頁的地球動態飛線&#xff0c;大家都比較熟悉吧 二、分析 由大量隨機的3點構造出貝塞爾曲線&#xff0c;然后開始從起點到終點的飛行后&#xff0c;然后再從起點到終點的消失&#xff0c;就此完成整個過程 三、基礎代碼 createCurve(startPoint, endPoint…

unity 2d 入門 飛翔小鳥 死亡閃爍特效(十三)

一、c#腳本 using System.Collections; using System.Collections.Generic; using UnityEngine;public class Bling : MonoBehaviour {public Texture img;public float speed;public static bool changeWhite false;private float alpha0f;// Start is called before the fi…